Repeating group layout to adjust naturally to content rather than fixed widths/heights or rows/columns

[james46]

I have a repeating group that prints out a list of categories as buttons. I would like for this list of categories to just naturally take up the size that each category’s text needs.

This is the outcome I’m looking for, where: 1) each category is on a SINGLE line of content, it never wraps in the button, and therefore each button contains a single line, 2) the button isn’t bigger than the content, 3) the content is next to each other and moves down to a separate line only if it doesn’t fit (which is why the 3rd category, a really long one, moves to a new line, rather than stay on the same line as the first 2 categories). Hopefully this makes sense.

I’ve noticed that the button sizes are controlled by the spacing the RG has set up.

So right now I have the following RG set up:

This produces the following outcome

Whereas if I set 2 columns, as here:

Then I get this:

Really unclear how to set up the RG to get what I want, thanks!

[Bluebird]

unticking the fixed columns and setting it to wrapped horizontally should do the trick

[james46]

where’s the option to wrap horizontally?

[Bluebird]

the scroll direction dropdown.

[james46]

ok interesting, so I did those 2 changes

t

i still got an unexpected result, the buttons are still not single line (this isn’t the end of the world, I need to shorten the content anyway), but there’s a really weird gap in spacing between 2nd & 3rd button? it appears Bubble is taking the width of the widest column and copying that across to all columns…

[Bluebird]

i was just showing you where the dropdown is in that pic. your settings should look like this:

[t2winassetz]

Yes. This is the right way.

[james46]

I’m sorry, still not getting it???

New result

Taking screenshots of the complete set up

[Bluebird]

enable “fit to width” in the group and text inside the repeating group. I believe that should fix it

[james46]

that just added a scroll

[Bluebird]

must be something else. here’s an example: geeafasdfasd | Bubble Editor

[james46]

OH it was a default setting in the child element, damn so stupid, thank you