Streaming live at 10am (PST)

Mobile breakpoint changing everytime

I’m trying to edit each mobile breakpoint right now for my site and whenever I change the top breakpoint and then go back down, the lower breakpoint changes the above.

Such as: I fix the iPhone 12 breakpoint the way I want it, and then go down the XR and make the changes there as well. Now when I switch back to the 12 it looks different and is messed up again.

Shouldn’t breakpoints only be changing ones lower than them, not higher? I don’t mind changing every lower breakpoint but for it to keep affecting the above just makes this impossible.

Webflow has 4 preset breakpoints:

  1. Desktop
  2. Tablet
  3. Mobile Landscape
  4. Mobile Portrait

You also have the option to add 3 larger breakpoints:

  1. 1280px
  2. 1440px
  3. 1920px

Based on what you shared you were making changes inside one breakpoint. Thus the last change being the one that sticks for that breakpoint.

Little confused. If I want to make changes for the iPhone 12 and have them stay…then make changes for the XR and have them stay, how would I go about that?

You can’t in the designer. Both those devices are falling into one breakpoint even though they are different sized viewports. Only using custom code can you target specific devices.

1 Like