Forum Academy Marketplace Showcase Pricing Features

Responsive Design : Number of columns impacted by page width

Hi there,

Is there a way to put a condition on a repeating group to reduce number of columns in case the page width is reduced

If page width less than XXX => number of column moves from original to YY

This is important when showing a list with several columns on a desktop, but on iPhone it becomes awkward


I think it works the other way in Bubble world. You can make one column, then there’s a checkbox for “allow more columns if page is wide” or something like that.

I tried it, a bit cumbersome to use. I think a conditional statement is more easy and elegant.

Thanks for the tip.

I’d agree, there are definite improvements that could be made!

Create a second repeating group (RG2) that has a state that makes visible RG2 when desired width is achieved. In parallel, RG1 will have its own custom state that not be visible at whatever the breakpoint width is. Or is only visible under/over a certain width.