Hey folks. I’m trying to redesign my app landing page. I’ve got a layout like this:
…not bad. But when I drop the screen size down, the responsiveness engine does this:
I’m sure it’s because it was on 2 rows to start, but I don’t know how to make it so that when shrunk, it drops to 3 rows of two, and then just one column.
Anybody have any ideas?
Are these in a repeating group or are they all separate groups?
Separate groups. So…newbie alert…I’ve only ever used an RG for dynamic data. Is this the point where you tell me you don’t need to just use dynamic data in an RG?
Look into the use of the responsiveness setting for ‘wrap to previous line when stretched’ and on your original design set each group to be stacked in a container group, set each to have the ‘wrap to previous line when stretched’ setting and allow the container group to have a not fixed width.
I think I follow. As in…stack the cards vertically?
I’ve almost got it…the centre row is now just…a bit wonky:
Make each group not fixed width and setup the min and max width to your liking…this will allow them to stretch and fill up the gap…
Thanks for your help, @boston85719 !