https:/
The thing with switching to a new formatting context, as we do with flex and grid layouts, is that the minute you use
display: flexordisplay: grid, a set of initial values get applied to the container and direct children. Those initial values should do something useful, or at least not do something weird.
I agree, I also prefer display: masonry.
Item Flow, Part 1: A new unified concept for layout
As we worked through the details, we started to get excited. Suddenly new features for Flexbox and Grid that people have wanted for years had an obvious…
Should masonry be part of CSS grid?
An exploration of examples showing masonry as both a part of CSS Grid and as its own display type. Ahmad provides compeling use cases and code examples…
Learn Grid Now, Container Queries Can Wait
There’s no rush to rip out all your media queries, and replace them with containers. You’ll be fine waiting for widely available support and your…
I wonder if MDN could add screenshots of the live examples, so people can see the result even if their browser doesn't support a feature yet.
For example for CSS Grid masonry layout:
https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Masonry_layout
I'm using Firefox, so I had to activate the layout.css.grid-template-masonry-value.enabled flag to see the “good” result.
An Interactive Guide to CSS Grid
In this tutorial, I'm going to share the biggest 💡 lightbulb moments I've had in my own journey with CSS Grid. You'll learn the fundamentals of this…
Rachel Andrew 
Ahmad Shadeed
Miriam Suzanne
Josh W. Comeau