I have a header with two responsive elements - one Icon left aligned and one text center aligned. The margins on each appear to have plenty of room to compress, but the margin explanation is indicating the margins can’t be squeezed and the centered text keeps dropping to the next line immediately as the screen gets smaller.
The behavior I was expecting here was for the text to remain centered on on the same line, but something I can’t see is triggering the drop.
I’m guessing this is something I’ve just not set up right, but wondering if anyone else has run into a similar issue and found a fix?
Right, so Bubble preserves margins more than elements widths, as you see on responsive websites. But it’s easy enough to change that if you need: see what I did with some shapes. If you make them without background they’ll be invisible.
Thanks @emmanuel - based on what you did I just made the text element as wide as the floating group then layered an icon over it in a separate test lower down that same page. As you said, working with element widths vs. margins made this work. Super helpful to know and thanks for taking the time.
