css, javascript 

Know what's great for long-form text on these widescreen monitors? Multi-column layout!

And CSS has columns these days.

So just as long as there's an easy way to advance to the next column or page…

column-scroll.glitch.me/

haven't quite got it. A column isn't exactly an element in the DOM, so I'm having trouble accurately querying its width, in order to know how much to scroll.

Follow

re: css, javascript 

I've had some success combining this with Scroll Snap, which is a handy thing for this use case:

developer.mozilla.org/en-US/do

where my arithmetic gives me a close-enough value and then scroll-snap will snap to. But it would be nice to not need to both add the keybinding *and* manipulate the document's CSS.

re: css, javascript 

I was about to write "`scroll-snap-type: mandatory` is not sufficient on its own," and I went to double-check.

I *do* have scroll-snap working so Firefox's default handling of the right arrow key gets to the next column.

But not left. It must always round up or something, so 1 + 0.1 = 1.1 → 2, but trying to go backwards 2 - 0.1 = 1.9 → 2.

Show thread
Sign in to participate in the conversation
Toot.Cat

The social network of the future: No ads, no corporate surveillance, ethical design, and decentralization! Own your data with Mastodon!