Mobile breakpoint changing everytime

Design help General
1

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.

2

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.

4

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?

5

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