Please make cols center in horz repeating groups

Right. So, it’s not that it’s not centerable. It is.

However, Number of Columns is static. So, if there are 7 columns configured, you’re stuck with that and if datasource:count < 7, you’ll have empty cells. (Because cells index from left to right, any empty cells will be to the right. Cell’s gotta fill from somewhere, right?)

Now, an observation that might provide us with an algorithmic workaround:

When a horizontal RG’s container (like a page or a group) is too small (not wide enough) to contain it, it can drop (hide) cells that don’t fit.

That’s interesting.

I’ve done that before with RG’s for things like reviews.

Now, I don’t think we can control the width of a group in vanilla Bubble via conditions. But it looks like you can with CSS Tools plug-in.

So that would be one way. (It’s just a simple math problem: If source:count < 7, set the RG’s parent group’s width to whatever you’ve set the cell min width to be * source:count)

That seems like it should work. (Obviously the cell min and max width need to be the same, so make sure you set your cell min width to its width at 100% in your design.)

If that does not work (or can’t work) you can brute force it, which I suspect you might be doing now, right?)

Build your 7 wide RG (first), AND your 6, and 5, and 4, and 3, and 2 and 1 (Which at that point isn’t an RG, I guess!)…

Condition 1 thru 6 such that they only show when source:count = their number of visible cells. The 7-wide RG should be conditioned such that it’s only visible when source:count is equal to or greater than 7.

This is kinda doubly redundant as of course the 7-wide can be configured to drop cells as the page width narrows. (And all the others should be configured the same way, which is part of why I say build 7-wide first so you can just copy-paste to build the others).

But you can achieve your design idea. It’s just kind of a pain in the butt. If the first idea works, that’s the best one obviously.

I tend not to get spun by INTERFACE (presentation layer) stuff that’s difficult with Bubble. Design a different interface, submit an RFE and hope it gets done.

However, there’s almost always a way in Bubble, if you insist on a certain layout. Some seemingly hard things are easy (I cloned the Airbnb photo uploader, for example, and it’s easy-breezy-ish), and some things that should be easy-ish are hard. (Yours is a pretty good example, I guess.)

In the brute force method: consider building it on its own page FIRST and turn it into a reusable to make it easier to maintain and use if you really wanna do it.

I’m not in front of my real machine right now, so all the above is just from my head. There may be other ways that would be apparent when actually noodling around in Bubble.

ASIDE: BTW, if the issue REALLY WAS that horizontal RGs can’t be centered, but num columns WAS dynamic, we could solve this problem easily with a nested RG contained by a group. But that’s not the issue, and we don’t currently have dynamic num entries in RGs.

1 Like