How To Edit Mobile Breakpoint Layout Without Impacting Upper (e.g. Desktop) Breakpoints

Hi Everyone,

I am working on trying to edit the layout and style from the mobile breakpoint without impacting the upper base breakpoints. I’m including a video for reference. It continues to change regardless of what I do which I thought was not supposed to happen?

Any direction towards resources that would help would be greatly appreciated.

Video showing issue: https://www.canva.com/design/DAF1MKFdwjQ/9cA4V0rEWai596uW_V-YTQ/edit?utm_content=DAF1MKFdwjQ&utm_campaign=designshare&utm_medium=link2&utm_source=sharebutton

Thanks in Advance and Best,
Ryan


Here is my site Read-Only: Webflow - Run By Ryan

Hi @RunByRyan

In the example you’ve shown, the reason why changing the order of the image on the mobile breakpoint changed across all breakpoints is because you’re changing the ordering of the element in the Navigator, which is essentially affecting the HTML structure which is different from styles or CSS.

To achieve the effect you’re going for, I would keep the text on the left and the image on the right. Then on the desired breakpoint where you want the image to appear before the text, change the Order to First. This way the image is rendered before the text even though it comes after the text in the Navigator.