Grid Lanes masonry settles on Grid syntax, and flow-tolerance is now fit-tolerance
Yuki Tanaka
If you wrote flow-tolerance somewhere in a Grid Lanes prototype, rename it. Saleh Mubashar's walkthrough on Piccalilli, published 22 October, says the property is now fit-tolerance. The layout mode itself is display: grid-lanes, and according to the article it works in Safari 26.4 and later, while "support in other browsers is still evolving."
The smallest version is three declarations, and they're all ones you already know from Grid:
.masonry {
display: grid-lanes;
grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr));
gap: 1rem;
}
That reuse is deliberate, and it took a while to get here. Rachel Andrew opened a CSSWG issue asking for a native Pinterest-style layout in 2017. Two competing shapes followed: grid-template-rows: masonry on a regular grid (Mozilla's idea, later picked up by WebKit) and a separate display: masonry mode from Chromium. In January 2025 the CSS Working Group agreed to reuse Grid's track-definition syntax, and the article says the name display: grid-lanes was settled in December 2025. Spanning works the Grid way too: grid-column: span 2 on an item.
The knob that got renamed
The browser places each item in a lane, usually the shortest one. fit-tolerance decides what counts as "shortest" when lanes are close in height. Per the source, 0 favours the tightest packing. A larger value lets the browser treat near-equal lanes as equal, so items stay closer to source order, and infinite takes that all the way. The default is normal, which resolves to 1em.
.masonry {
fit-tolerance: 0;
}
That's the one thing I'd try today. Open a card grid in Safari, flip between 0 and infinite, and watch where the cards land. The article also notes that source order stays intact even when items move around visually, so it's worth checking keyboard order on your own content.
The caveat is the support line. One engine ships it, so for now this is progressive enhancement: browsers that don't recognise grid-lanes ignore that declaration, which means your fallback layout has to come from a declaration they do understand. What I'm watching next is whether the other engines ship it under the settled name, and how subgrid cards inside a Grid Lanes container behave in practice. The article says subgrid can work alongside it, since masonry now lives inside the Grid model.
Source: Piccalilli (piccalil.li)