Scroll Snapping
It's been several years since paying attention to the web platform was a big part of my full time job, and I was curious if I'd missed any interesting additions. I did some poking around with Claude and ended up finding something neat, but a bit different than I was looking for: scroll-snap-type.
Scrolling through long lists of things I've often been mildly frustrated at how much precision I need. I want to move down a bit, perhaps to see the next post in a feed, but without going a bit too far and losing the first few lines. Looking through Claude's output I saw:
Scroll snap: Control scroll positioning with
scroll-snap-type(2019)
Looking on MDN it seems to offer just what I was looking for: scrolling that tries to avoid splitting content.
The main place on my website where I've wanted this are my pictures, and I've implemented it there. Give it a try!
The code changes were really simple:
html, body {
scroll-snap-type: y proximity;
scroll-padding: 0;
}
figure {
scroll-snap-align: start;
}
While I didn't see other things in Claude's list of newish features that seemed exciting, is there anything else neat I might have missed?
