CSS :nth-of-class selector


That’s not a thing.

But it kinda is!

Bram covers how frustrating .bar:nth-child(2) is. It’s not “select the second element of class .bar.” It’s “select the second element if it also has the class .bar.” The good news? There is a real selector that does the former:

:nth-child(2 of .bar) { }

Safari only. Here are the tickets for Chrome and Firefox.

Direct Link to ArticlePermalink

The post CSS :nth-of-class selector appeared first on CSS-Tricks.

This post was originally posted here

Check out our Starter Sites built with #ToolWeLove including Toolset, Elementor Pro, and Astra Pro.


Share this page
Share on facebook
Share on google
Share on twitter
Share on linkedin
Share on email
How to use CSS Scroll Snap

Nada Rifki demonstrates the scroll-snap-type and scroll-snap-alignCSS properties. I like that the demo shows that the items in the scrolling container can be different sizes. It is

Read More »
Emergency Website Kit

Here’s an outstanding idea from Max Böck. He’s created a boilerplate project for building websites that fit within a single HTTP request. This is extremely

Read More »