Hi everyone. Hopefully I’m missing some simple setting, because I’ve seen this in two entirely different test apps. If I create a repeating group with more than one column, the rightmost column’s layout goes crazy. It looks fine in the editor, but not in preview mode. I’ve tried Firefox, Edge, and Chrome with the same result.
This happens when multiple elements are on the same horizontal level. Doesn’t matter if it’s 3 columns or 2 columns, it’s always only the right column that has the problem. On a 3-col layout, the middle column matches the expected left-hand layout. If I let the page expand the entire width and I see 6 columns, I get 5 normal columns and the strange rightmost column.
Yes, I deal with this issue as well. You can typically make it work by adjusting the responsive settings and using strategic grouping.
For instance, try selecting these three elements and grouping them together.
Do the same with these two
It would help to put all the elements including the two groups you just made into a single group that can act as the container.
Make sure your buttons are not set at fixed width. They need some room to breath a little or they will jump around your design as soon as the cell width is smaller than the size you designed it.
The other issue you are dealing with is this space right here
Bubble will not collapse this space before pushing elements around on the page. While it looks like your two column RG has more margin than your three column, it’s not treated as such. As soon as your cell width is resized smaller than what it is showing in the editor, the actual elements will be getting squeezed as well.
That should fix your issues but it doesn’t change the fact that the right column on a repeating group does seem to be some percentage narrower than the columns to the left.