CSS :is

There are dozens of developers who hate CSS; do not grasp it, will not get it, etc. Most of it is either down to inefficiency within the language or misunderstandings about how to properly construct a website structure. I love CSS the most, but there are some parts of the language I always hated, like having to repeat very similar choices. That’s why I was so happy when I saw CSS :is ; a method to avoid duplication within your voter structure!

You all remember this thoughtless CSS iteration:

section h1,
section h2, 
section h3,
article h1,
article h2,
article h3 {
  /* styles here */
}

I always hated having to do that – lots of maintenance costs and inflated CSS files. It is here :is comes to the rescue:

:is(section, article) :is(h1, h2, h3) {
  /* styles here */
}

is: is a perfect summary of how a small addition to the CSS language can make a developer’s life just a little easier!

The post CSS: first appeared on the David Walsh Blog.

Leave a Comment