Hi the community,
I need your help on responsive best practices! 
My web-app is composed of a Menu ; which is a Floating group.
Under this Menu, there is a Group.
When I decrease the screen’s width, this Group goes behind the Floating group.
Instead, I’d like to keep the margin between the both elements.
I’ve tried everything through the UI Builder and the Responsive page, but I can’t find the solution.
If you guys know how to do it, I’ll be happy to have your tips! 
Thanks a lot! 
It’s probably because your Floating Group is selected at “Above all elements.” If you are talking about your nav items jumping to the next line, group them.
Hi @johnny,
Thanks for your prompt reply.
I’ve already tried to select “Beneath the page” instead of “Above all elements” and with this settings, the Group goes in front of the Floating Group.
I also tried to make a group with the elements in the menu, but it doesn’t change either.
If you have any other idea, I’m in! 
Thanks again
I’m not the best at responsive design, but I’m sure @J805 could maybe help. He’s the best responsive design expert I know 
Looks like the floating group is the blue group that is supposed to be a header. You need to place those text elements into a group make that ‘container’ group fixed width with a center alignment. Then when you decrease page width the text elements will not collapse down on themselves.
Once the page width is narrow enough that the text elements are forced to collapse on themselves, it is time to switch to a menu icon
This topic was automatically closed after 70 days. New replies are no longer allowed.
