Flexbox Masonry Layout (Explained with Math)
Flexbox has a very specific algorithm for determining how to deal with remaining (or lack of) space in a row. Let’s use actual math to understand it then apply it to a masonry layout.
Flexbox has a very specific algorithm for determining how to deal with remaining (or lack of) space in a row. Let’s use actual math to understand it then apply it to a masonry layout.
Last we checked in with how the web platform was planning on helping us with “masonry” layout, it was a versus battle between “just use grid” and “make a new layout type”. Now Apple folks have an idea: a new shorthand property called item-flow. Nothing is decided here (I don’t think), but it seems very […]
After the big shakeup with masonry layout recently (Apple: Make it part of display: grid;! / Google: Make it display: masonry;! / Me: I’ve got questions and I’d rather see tabbing order issues fixed first), I was very keen to hear where it would go. It took 5 months, but we’ve got movement. The CSS […]
Two months back there was a bit of a hubbub about masonry layout in CSS with Jen at Apple making a case and Rachel at Google agreeing those use cases would be great, but should be based on display: masonry; not display: grid;. Then: nothing. Web standards just move at the pace that it moves […]
I wrote in my masonry proposal feedback: Are there any more fleshed out alternative proposals? I thought Jen presented strongly that CSS grid is a great place to put masonry layout, but also that it wasn’t arguing against anything else. Rachel Andrew has that “anything else”, which is display: masonry; with more explanation. What’s nice […]
Jen Simmons posted Help us invent CSS Grid Level 3, aka “Masonry” layout over on the WebKit blog the other day and is actively soliciting feedback. Our hope is that web designers and developers chime in (post to social media, write blog posts) with your thoughts about which direction CSS should take. Don’t mind if I do. Do […]
Frontend Masters donates to open source projects through thanks.dev and Open Collective, as well as donates to non-profits like The Last Mile, Annie Canons, and Vets Who Code.