Skip to main content
CSS is fun and cool and I like it.
Article

Weekly Platform News: CSS Scroll Snap, Opera GX, PWA Install Icon

In this week's roundup, Chrome is adding an install option for Progressive Web Apps, Opera GX comes to Windows, the ECMAScript proposals get an update, and CSS Scroll Snap is coming to a Firefox browser near you.
Article

Fixed Headers, On-Page Links, and Overlapping Content, Oh My!

Let's take a basic on-page link:

<a href="#section-two">Section Two</a>

When clicked, the browser will scroll itself to the element with that ID: <section id="section-two"></section>. A browser feature as old as browsers themselves, just about.

But as soon as position: fixed; came into play, it became a bit of an issue. The browser will still jump to bring the newly targeted element into view, but that element may be obscured by a fixed position element, which is pretty bad UXRead article

Article

Practical CSS Scroll Snapping

CSS scroll snapping allows you to lock the viewport to certain elements or locations after a user has finished scrolling. It’s great for building interactions like this one:… Read article

Link

Scroll to the Future

Link

Carousels Don’t Have to be Complicated

Article

Introducing CSS Scroll Snap Points

Before this new CSS I'm about to introduce existed, locking an element into the viewport on scroll required rigging up some JavaScript. As you may know, JavaScript has a well-earned reputation to be tricky when paired with scrolling behavior.

The new CSS Scroll Snap Points spec promises to help, allowing for this kind of behavior using very few lines of CSS.

As happens with very new web tech, this spec has changed over time. There is "old" and "new" properties … Read article

Link

Thinking Ahead: CSS Scroll Snap Points

Link

Native CSS Scroll Snap Points

Article

Creating responsive, touch-friendly carousels with Flickity

By now, any article about carousels should come with the disclaimer: You may not need a carousel. Carousels are easily abused. Kyle Peatt has more details on the carousel controversy.

Part of the blame can be put on the user experience of carousel plugins themselves. Scrolling through a carousel is less satisfying and more awkward that simply scrolling down a page. Basically, you can't flick through them. Third-party libraries should at least be as useful as native behavior.

On top … Read article

icon-link icon-logo-star icon-search icon-star