Goal: I want to space 3 components close to each other on a line horizontally.
Steps:
create 3 components
1st and to the left most position create a text input box with label on top.
2nd and to the middle a text box that has value "@"
3rd and to the right most position create a select field.
It represents email address all combined as "james.bond" in 1st component and selection value from last component such as "gmail.com"
I like to show all these three up in a nice minimal spacing between components. today "@" text box takes up quite a bit of room and I can't make these component any closer than what Retool Designer UI allows.
Using an icon for the '@' can help fill the space (if not in a little bit of a goofy way) however, with the minimum component width this is as snug as I could make three horizontally aligned components:
Reducing the height of the icon reduces the overall centered size but leaves more space visible from the minimum width:
In either case, disabling the margins on all of the components can get you a bit more snug, but it's still always going to take up a minimum 3 block width (1 block per component):
