Making Structural Changes to Lower Level Views Without Having Responsiveness in Upper Level Views

I am trying to make structural changes on the phone views that I do not want to be responsive for the desktop and tablet views.

My situation is this:

For the desktop and tablet views, I have a text div on top of two images that are side-by-side. When I go to the phone views, I would like one of the images to move above the text div, so that the text div will now be in the middle of the two images. Here is an illustration of what I am trying to do:

Desktop and Mobile views
SAMPLE TEXT
IMAGE 1 | IMAGE 2

Phone Views
IMAGE 1
SAMPLE TEXT
IMAGE 2

When I try to make these structural changes to the phone views, it changes the structure of the two upper level views as well which I do not want.

How can I counteract this? Thanks.

Hello @kb1196 :smile:

The easiest way to do it is just duplicate the divs that you want in different positions at different break points, add a sub class for the breakpoint and use the breakpoint hide/display function under the settings tab for each div and organize it how you need it done.

For more information please see this post: http://forum.webflow.com/t/help-me-change-sequence-of-divs-based-on-breakpoint/13465?u=waldo_broodryk

Thanks for the input @Waldo_Broodryk!

I see what you are saying and will use that method if need be, but I was hoping there was an easier and more effective way to solve this problem.

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.