#grid-lanes

[ follow ]
#css-grid #masonry-layout #browser-support #progressive-enhancement #layout-hacks
Web development
fromWebKit
1 week ago

When will CSS Grid Lanes arrive? How long until we can use it?

Grid Lanes enables native CSS masonry-style layouts and is available in Safari Technology Preview while Edge, Chrome, and Firefox progress toward full support.
fromCSS-Tricks
1 month ago

Masonry Layout is Now grid-lanes | CSS-Tricks

In that same GitHub thread, you'll read that Tab Atkins-Bittner shared a "hacky" way to go about it with CSS Grid. You can have Grid do Masonry if you know the heights of the items ahead of time. It's a bit hacky, but you set the grid container to grid: auto-flow dense 1px / <column widths here>;, then set each item to grid-row: span <pixel height as integer>; (for example, if the item is 50px tall, use grid-row: span 50;).
Web development
[ Load more ]