Post

#CSS only carousels arrive in Chrome 135 ⤷ nerdy.dev/css-carousel...

so no available fall back for other browser clients??

some of the examples in the gallery 'work' in Safari, just different - a little bit of @​supports and PE should sort everyone out I reckon :) chrome.dev/carousel/

My site's image carousel is using the new stuff where supported and fallsback to showing a scrollbar where it's not. Does the job for what I need.

link to demo?

I’m curious about why there are `scroll-state(snapped)` container queries, while the specification (Scroll Snap level 2 to be specific) contains `:snapped` pseudo classes. Are they for different use cases?

:snapped is an added bonus we'd like to get to, but we instead hit 3 birds with one scroll-state() stone (snapped, stuck, overflowing) and paved the way for other container queries around state there's also the snap events, which have their own advantages over the scroll-state() queries or :snapped

Since `::scroll-button()` and CSS inert will be added to browsers, I feel something like `.carousel-item:not(:snapped) { interactivity: inert }` should be possible. I guess that is doable with container queries as well, but it feels a bit awkward because of that extra container element.

I've only given it a 2 minute side-by-side to see what's 'different' to come to the conclusion that 'there are ways' :))

it does look like i have layout / container query work to do to make these demo's have better fallbacks. i'll add it to my work backlog!