Unwanted White Space in Repeating Group

Is there any way to collapse this white space and have the items be next to each other, and fit to width?

When I set the row settings to just 1, it’s fine, but row settings at 2 will kabosh it

Hi there, @drixxon… I could be off base here because I have never used it, but isn’t what you described the purpose of the masonry layout for repeating groups? Apologies if I have missed the mark because, again, I have never used the feature, but that’s what I thought it was for, so I didn’t think it could hurt to mention it.

Best…
Mike

Another option is to simply set the Scroll direction to Wrapped horizontally

You’ll have to deselect Set fixed number of rows.

wrapping horizontally like in your settings produces this:


You’re spot on except, masonry only works when you have a fixed number of columns, and a dynamic number of rows.

So like the instagram explore page is a pretty perfect example of a masonry grid.

Bubble doesn’t give you the masonry option at all when I have a fixed number of rows, (1), but a dynamic number of columns!

1 Like

If Fit width to content is set on the RG or a containing element (via the Layout tab), then that’s what you’ll get. The RG must be allowed to “expand”.

Here’s an example from my library…

wrapping-tags

Try setting ‘Min width of column’ to 0px. Right now what it’s doing is eery single element is stretching 100% wide and being considered it’s own column width, so it’s not adding any more columns. This, coupled with your already selected ‘Scroll direction: Wrapped horizontally’, and not having a fixed number of rows or columns (and no stretching of either) should get you what you’re expecting.