Response breaks

It seems Bubble doesn’t automatically stack groups within a row container on small screens. Instead, it smushes things together and it becomes hideous and unusable.

Is there a way to tell it “when these groups don’t fit next to each on the screen, stack them vertically instead”? Ideally a conditional that says something like “if screen is smaller than X, then make this a column instead of a row.”

I couldn’t find a clean way, so I tried duplicating my row group and turning it into a column view, then setting conditionals to show the row version on big screens and the column version on small screens. I used “current mobile view breakpoint is < 375” for my conditional. That didn’t work at all in my preview. I just showed the default even when I toggled to iPhone SE (which is 340).

Any ideas?

Thanks, all.

No you cant cange the group layout, form horizontal to vertical, you can make a row and make the child element to not decreese its width after certain pixle let say 320px,

1 Like