I think I have just about got to the point where I can use “spacers” in responsive mode to get things like headers to squash up properly, rather than jump around like the House of Pain.
However, I am not sure I really understand WHY putting a transparent box next to some text makes it move whereas having a great big space … doesn’t.
Any simple explanations for a non-designer ?
I also use a lot of spacers to make responsive work. A big empty space is treated as a margin and not allowed to shrink (only option is to completely collapse). Where as a spacer group will maintain the small margin between itself and your group but the spacer will change its actual width depending on your limits. At least that’s my understanding, if poorly explained.
Thanks.
Maybe it is just me, but it seems counterintuative.
But if you think of it in terms of margins as you mention … that seems to make more sense. So if you stick you text up against something else, you are telling Bubble that you don’t mind it being squashed. If you give it loads of space, you are saying “Give it space” ?
It is kinda counter-intuitive. The left/right/center seem to control which margins are fixed and which can be stretched/collapsed. At least one side seems to always be fixed. I would love to be able to have more fined-grained control over how the margins behave as the page changes sizes. I build all RG/table headers using spacers and match exactly the RG layout using text elements and spacers where needed. If you align everything left to right the exactly the same and make sure that every responsive setting matches between the RG and the header you can get it to maintain the alignment.
Yes, the “left/right/centre” seems to do the opposite of what I expect to happen 
