The Latest in the “How are we going to do masonry?” Debate: Apple Says “Item Flow”

Chris Coyier Chris Coyier on

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 sensible. I like how it has meaning to multiple layout modes, potentially opening up new possibilities instead of masonry alone. They are going to elaborate in a future post, but it sounds like item-pack: collapse; is the road to masonry specifically, perhaps across multiple layout modes.

I’ll repoint to my feeling that reading-order is very related and also opens possibility in that we can use what we’ve already got in broader ways without negative accessibility implications.

Wanna learn modern CSS layout?

Frontend Masters logo

Laying out designs on the web with CSS has gotten a lot more powerful in recent years. CSS grid, flexbox, and container queries are incredibly powerful tools for that, and we have a complete learning course on them from Jen Kramer.

7-Day Free Trial

Leave a Reply

Your email address will not be published. Required fields are marked *

Did you know?

Frontend Masters Donates to open source projects. $363,806 contributed to date.