Hi. I am a newbie from Elementor here, so appreciate your help.
In Elementor there is an option to swap columns on mobile (e.g. if I have an image on the right on desktop, it shows below the Header on mobile, I want to show the image above the header on mobile, and to the right on desktop and tablet). The other option to achieve this that I had in Elementor was to hide the whole section on Mobile, and then just build a new section that only shows on Mobile, and hide the āDesktopā section when viewing on mobile. Is any of this possible?
Thanks
on the top bar inside the builder mode, you can switch between different breakpoints. If you change the elementsā order in one of them, then shouldnāt this change remain for this particular breakpoint?
But if there is no such native capability in the builder, you could use typical CSS media queries for specific breakpoints, to show or hide an element or to change the alignment/orientation.
I havenāt really got to the point of making changes for tablet or mobile view yet, but this is what I whould try first. So forgive me if what I say is mistaken!
On the mobile breakpoint, set the containerās display (Content tab > Display) to ānoneā to hide it.
To swap columns on mobile, you can either reverse the flex direction or set the flex display order on each column.
Incredible fix and should be in the wiki IMO. Thereās a bunch of components that donāt really work with breakpoints but this works fluidly.
For my use case, I wanted to have two different headers; on mobile, nav - logo - button, on desktop, logo - nav - button. I ended up making two top-level Container elements and hiding the desktop one on mobile breakpoint and vice versa. Works very well.