How to make 3 column repeating group responsive?

[hirayaleads]

I am using the new responsive engine. I have setup a 3 column repeating group for my saved documents.

The repeating group is a row and inside is a group to hold the text info which is using a column

Now when I make the screen size small it doesnt go stack on one another like it should

when I try to reduce the screen size, it behaves like its fixed layout

please help thanks!

[sudsy]

How have you configured the RG on the Appearance tab of the property editor? If it’s not set to a fixed number of columns, then check the minimum column width.

-Steve

[hirayaleads]

I set it to 3 columns because I needed 3 columns

and this is my width settings on the layout

Not sure if I am doing this correctly

[sudsy]

@hirayaleads

I set it to 3 columns because I needed 3 columns

Then why would you expect it to stack? You just set it to a fixed number of columns.

To get what you’re after, try unchecking that option and then playing with the min column width and max RG width. For example, setting the RG max width to 900 and the min column width to 300 will create 3 columns on large displays and wrap the cells when the RG width drops below 900.

(You’ll want to disable the separator as well - or at least take its width into account when determining the RG max width.)

-Steve

[hirayaleads]

Thank you it worked!

I am really having a hard time understanding responsive engine

[hirayaleads]

Hey pal, do you happen to know on how to limit the number of repeating group to show?

I did not set any rows or column to achieve the responsive layout. However, it will just continue to add and add repeating group downwards.

The thing I want to achieve is it will only show 9 repeating group and then add a pagination at the bottom

I am watching this tutorial for that: Bubble.io Pagination: How to Create Pagination for Repeating Groups - YouTube

Problem is I cant set a limit on how many Reapeating group I willshow per page