Change Number of Columns in RG When Page Width Changes

Hi Everyone,

There is something I am stuck on with the new responsive settings, which used to happen automatically if I am not mistaken.

I have a repeating group with 3 columns. However, as the page width decreases, I would like the number of columns to decrease to two, so that the RG cells do not overlap with each other.

Is there a way to achieve this?


Assuming your RG ha a fixed number of columns, just use add a condition to change the number of columns to 2 when then page width is less than the desired width.

If your RG doesn’t have a fixed number of columns, then you’ll need to set your column minimum widths, and RG (and container element) max widths accordingly.

Thanks, that makes sense to me. I will try that solution. I assume I have to set the minimum cell width in pixels, rather than as a %, which may be what is causing the issue as well.

I love the new components/responsiveness system, but this is one thing that just worked out of the box with the original system that appears to have been removed, surprisingly.

you could also use the function of an rg to display items as a masonry grid and fit the cells to their width or height