3 Column Foundation - mobile


I have another question - this time ergarding the responsive behaviour of a 3 column foundation. I have six animate stacks in it (in two rows), that each have an image and a h6 in it. On desktop that looks very nice, on mobile, it seems the display order gets confused. You get pic 1 of row 1 then pic 1 of row 2 then pic 2 of row 1 and so on - instead of all the pics of row one and then all the pics of row two. I’m sure it can be set somewhere, I just haven’t found it. What am I missing?

Many thanks, Matthias

Do you have a screenshot of your Rapidweaver settings in edit mode?

Jason, thanks for your reply - which ones are you looking for specifically - I probably won’t get them all on one screenshot.
thx, Matthias

Sorry, the columns themselves for now (not the settings). Just trying to visualize what you’re asking before I try and comment. It could be a ‘source ordering’ setting to suggest but I’m not positive

They will go in order row 1 all items, row 2 all items, row 3 all items. Not across, but down.

Jason, got it. attached is a screenshot - hope it covers what you are looking for.

best, Matthias

As Lisa inferred, if you want all of that first row to appear on mobile, and then all of that second row to appear next, just divide that into two 3-column stacks, with row 1 in one, and row two in the other. It’ll look the same on desktop but should break the way you want on mobile


Thanks everybody, will do that.

1 Like