My favorite new CSS feature

View this email in your browser (or share it with a friend!)

Hello Reader,

It’s hard to pick one thing because there is so much to pick from right now, but I think my favorite new CSS feature is anchor positioning.

Check out this navigation that I’ve put together for a project I’m working on, where the underline and link highlight is all from a single pseudo-element.

That’s all done with something like 20 lines of CSS!

And, with a handful more, I created a decent fallback for browsers that don’t support it yet, that while not as fancy, I think it does a good enough job as a fallback.

If you’re curious on how I did it, I don’t have a breakdown of this one (yet), but it’s quite similar to what I looked at in this video a little while ago, with the big difference being a couple of delays in the transitions.

And it’s only getting better from here, with Chrome having recently shipped the ability to detect which fallback you are using (if you are using them), so you can make further adjustments, which is great for things like tooltips.

There’s a lot of other great things that are coming as well, but I think anchor positioning is going to be a bit like :has(), gaining a lot of usage quite quickly as it’s support increases, because it’s easy to use (though it definitely has it’s quirks!) and is useful for so many different things.

📺 3 Powerful nesting tricks

Following up from last week’s video where I looked at the basics of nesting, this week I take a look at what we can do when we get a little more creative with how it works.

⚡ Simplified modifier classes with this CSS trick

A quick look at how we can use attribute selectors for modifier classes. This has the potential to clash with other classes, so you do need to be careful with it 🙂.

🎙️ Podcast

When a passion becomes a grind

When a passion becomes a gri...

Dec 19 · General Musings with Kev...

11:22

This week I talk about the transition from enjoying coding for fun to facing the challenges and grind of doing it as a job. It's hard to find that balance between finding meaning in your job, and how you can loose your passion when it turns into a career.

LISTEN ON: APPLE | SPOTIFY | YOUTUBE | RSS

🔗 Other awesome stuff from around the web

CSS Wrapped 2025
Make it ugly, for clients
CSS scroll-triggered animations are coming!
And if you’re looking forward to something fun for next week, the CSS is Awesome game is back on December 18th! I won’t be on it again this year, but it looks like an awesome line up, and I’ll definitely be in the chat 😀

📝 Quiz time!

A few weeks ago I had a tricky selector question that most people got wrong (only 14% got it correct!). This one's tricky too, but a bit different: Only one of these selectors is valid, which one is it?

:is(> *)
:has(> *)
:not(> *)
:where(> *)

As per usual, you'll have to head on over to YouTube to take a stab at the quiz, and once you answer, you'll see if you were right or not.

🏁

Have a fantastic week!
Kevin

Are you looking to step up your CSS? I've got both free and premium courses to help with that! They cover a range of skill levels too 👇

Beginner friendly (and free)

HTML & CSS for Absolute Beginners

A free course that starts with the absolute basics, and gets to creating some layouts with Flexbox and Grid.

Enroll →

Intermediate

CSS Demystified

For those who've been writing CSS for a little bit now, but want to step up their game and start writing CSS with confidence!

Enroll →

Intermediate (Frontend Masters)

Build a Modern Site from Scratch

Build a fully responsive site using modern CSS features, along with some polished animations.

Enroll → (25% off first month of Frontend Masters if you use this affiliate link)

If you no longer want to get any emails from me, you can unsubscribe or you can edit your preferences if you'd like pick which emails you get from me.
600 1st Ave, Ste 330 PMB 92768, Seattle, WA 98104-2246

Hi! I'm Kevin