Elements don't respond 'enough' to stay in view

I’m using the responsive engine on a reusable element for my header. The menu items seem to move to the left as I make the screen smaller (Which is what I want, until it hits a certain screen size). But it doesn’t move ‘enough’, thereby cutting off the elements. How do I ensure that the elements are always in view as the screen gets smaller? I don’t want it to be ‘halfway responsive’ if you know what I mean…

change your min width of the elements that aren’t downsizing enough

I tried that, but it didn’t help. Check out this link: Ohkie (bubbleapps.io)

If you drag the screen from right to left, the menu items move, but not enough.

@nate3 - just like @doug.burden mentioned, it has something to do with min width. Make sure your reusable element itself has a lower min width too.

Heres what I found when looking into your HTML code…

image

Even when I remove the min width from that group, it doesn’t change the behavior I’m talking about. I just tried that too.

Thank you guys so much!
So much to wrap my head around, but so exciting at the same time.