Row Columns 1 not stacking on mobile

i added a container, then i added a row then select LAYOUT , Columns in the properties panel and choose 6 columns… i then changed the Row Columns in the properties panel to 1 within Mobile view… So it should stacked the 6 columns, it doesnt… BUT, if i remove the columns and add columns by making copies, it does stack the columns in Mobile view with Row Columns to 1… the code in the editor between the 2 methods i mentioned are exactly the same… For some reason its not displaying correctly in the Design window if you choose 6 columns from properties panel (my experience with 4.4.1)

I’m not entirely clear about your problem, JR, but it might be a cascade thing i.e. the col sizes are overwriting the number of cols in a row on various breakpoints?

I’d clear all the columns of their sizes then go back to the mobile view and use the ‘Row Columns’ slider (only) to determine how many columns you want in each breakpoint. Alternatively, you can cancel the ‘Row Columns’ and just set the width of each column but this method is not as simple.

Hi JR,

I can’t tell from your post for sure but I believe you are misunderstanding the column setting. The setting is column span not number of columns. Setting it to ‘1’ will create up to 12 columns side by side. To get the columns to stack you want to set that value to ‘12’ so the column spans all 12 bootstrap columns.

Hope that helps and welcome to Wappler!

thanks for the replie, just started using it as a trial, so need to play with it more to understand it better… thanks for the advice and suggestions

2 Likes