I’ve been making demos of CSS Grid level 3 lately,...

I’ve been making demos of CSS Grid level 3 lately, to show off what putting masonry/waterfall-like layout support in CSS Grid can do. (I’ve got 16 demos and counting!)

Here’s one with that includes View Transitions, running in Safari Technology Preview 192.

What do you want to know about how masonry-like layouts could work in CSS Grid?

Like 11 April at 20:57 | Open on front-end.social

3 comments

Daniel Schildt

@jensimmons Is there a way to reduce the motion, as that feels rather distracting on the video clip?

11 April at 21:02 | Open on mastodon.social

Bruno Philipe

@jensimmons exciting! One thing I'd like to see in a demo is having a number overlay for each item/image, so I can understand how the source list gets laid out with different settings

11 April at 21:05 | Open on breakpoint.cafe

counternotions

@jensimmons Is this image only or each item can be, say, a flex composite of image & text?

11 April at 21:24 | Open on mastodon.social

Go Up