Responsive issue. Why is this element wrapping?

I can’t work out why my right slider menu is wrapping to the next line on mobile.

There is plenty of room for it on the first row. I don’t understand what the ‘Explain Box Margins’ text is trying to say, it’s too difficult to understand. What am I doing wrong?

Please make your app public.

@dbevan Duh. Done.

1 Like

Take a look at the change I made to the top header. I deleted the 2 spacers, grouped all of the elements on the right side into a container, made it a fixed width, then aligned it to the right.

The problem is the “Group User Data” group. I’m not sure what you intent to do with this.

Ah I should have said - the user area should disappear when current page width is less than = to 515 but with this set, the menu was still wrapping to next row. You can see ive set it to hide in the properties editor but it is still retaining its width i guess and forcing menu to next row

Fixed. When you want the width of a hidden element to disappear, you use the responsive editor’s “hide when” function, not a conditional statement. Also, you want to make sure the element’s parent container isn’t fixed.

1 Like

Ah thanks heaps! You’re an angel for helping out. I have this exact instruction written down in my responsive notes but completely missed it.

1 Like

No worries! Glad I could help.

Take care,