prefers-reduced-motion: Taking a no-motion-first approach to animations

Given the widespread browser support for prefers-reduced-motion now, this approach makes a lot of sense.

prefers-reduced-motion: Taking a no-motion-first approach to animations

Tagged with

Related links

Tagged with

CSS or BS?

We show you a CSS property name. You tell us if it’s real or if we made it up. That’s it. It starts easy. It does not stay easy.

Tagged with

Don’t judge a book by its cover

Some neat CSS from Tess that’s a great example of progressive enhancement; these book covers look good in all browsers, but they look even better in some.

Tagged with

Responsive Letter Spacing – Cloud Four

Another clever use of clamp() and calc() for web typography, but this time it’s adjusting letter-spacing.

Tagged with

Cascading Layouts | OddBird

A workshop on resilient CSS layouts

Oh, hell yes!

Do not hesitate—sign yourself up to this series of three online workshops by Miriam. This is the quickest to level up your working knowledge of the most powerful parts of CSS.

By the end of this you’re going to feel like Neo in that bit of The Matrix when he says “I know kung-fu!” …except kung-fu isn’t very useful for building resilient and maintainable websites, whereas modern CSS absolutely is.

Tagged with

Related posts

Underlines and line height

How to make the distance of link underlines proportional to the line height of the text.

CSS snippets

Some styles I re-use when I’m programming with CSS.

content-visibility in Safari

Safari 18 supports `content-visibility: auto` …but there’s a very niche little bug in the implementation.

Schooltijd

Going back to school in Amsterdam.

Workaround

Browsers and bugs.