Breakpoint styles overwriting eachother

I’m noticing issues that when applying styles for tablet/mobile breakpoints, those styles are overriding initially set desktop styles up and down chain. This may be related to today’s Degraded Performance issues, but wanted to see if anyone else experiencing issues with responsive styles?

Hi there!

Breakpoint styling in Webflow follows a specific cascading pattern:

For larger screens:

  • Styles from desktop (base) breakpoint cascade up to larger breakpoints (1280px, 1440px, and 1920px)
  • Any styles set on larger breakpoints override the base styles for those specific sizes

For smaller screens:

  • Desktop styles cascade down to tablet and mobile breakpoints
  • Styles set on tablet breakpoint only cascade down to mobile landscape and portrait breakpoints
  • Changes made on smaller breakpoints won’t affect larger breakpoint styles

To ensure your styles appear as intended, always verify you’re applying them on the appropriate breakpoint, keeping in mind this cascading behavior.

Hopefully this helps! If you still need assistance, please reply here so somebody from the community can help.

Yes, but what I’m saying is making a change for a mobile style is going back up-chain and applying to my desktop styles. It shouldn’t cascade back up from mobile to desktop.

Hello @Chris_Kendrick, Welcome to the community!

Yes this probably had to do with today’s outage/performance issues. I was trying to clone a site and it keep saying that that domain name was taken, so I changed it multiple times, just to get the same answer. Then when the outage was resolved I got like 10 cloned projects in my workspace. My advice is that when you experience strange behavior like the one you had, first try to refresh Webflow, and if it persists, just wait until it is solved. I hope this helps.

1 Like