I’m looking to create a ‘feed’ grid where I embed different social media updates.
But since these have different heights, I’m having a hard time figuring out how to make each child wrap straight under each other (and not just wrap under the longest/heightest block).
Maybe it makes more sense when looking at it so far: http://new-botsupply.webflow.io/
Anyone has any ideas how to do this?
Hi, probably doable, do you mind sharing your read-only link?
I also played around with creating a container for each column with posts going down using ‘Direction: Column’, and that worked. But that makes it really difficult when going on smaller screens to show the posts in a chronological order (because it will always show all the posts in the inital column before going to the 2nd and 3rd).
Any help is much appreciated!
Your talking about making a Masonry grid, like pinterest?
Thats not possible with flexbox. When CSS Grid comes next year that will be possible, if I’m not mistaking
Hah, yeah excatly same idea as Pinterest apparently
Thanks for the comment
You can actually approach the result, the trick is to
So it’s a flex, column, with wrap AND a height defined, to force children to stack like bricks. You’ve got to adjust the height for the elements to fit in the viewport.
This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.