CSS :is |

This content originally appeared on David Walsh Blog and was authored by David Walsh

There are scores of developers who hate CSS; don’t get it, don’t want to get it, etc. Most of that is either down to inefficiencies within the language or misunderstanding of how to properly construct a website structure. I mostly love CSS but there are some parts of the language that I always hated, like having to repeat very similar selectors. That’s why I was so happy when I saw CSS :is ; a method of avoid duplication within your selector structure!

You all remember this mindless CSS repetition:

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

I always loathed having to do that — lots of maintenance cost and bloated CSS files. This is where :is comes to the rescue:

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

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

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

This content originally appeared on David Walsh Blog and was authored by David Walsh

Print Share Comment Cite Upload Translate Updates

APA

David Walsh | Sciencx (2021-05-31T11:38:22+00:00) CSS :is. Retrieved from https://www.scien.cx/2021/05/31/css-is/

MLA

" » CSS :is." David Walsh | Sciencx - Monday May 31, 2021, https://www.scien.cx/2021/05/31/css-is/

HARVARD

David Walsh | Sciencx Monday May 31, 2021 » CSS :is., viewed ,<https://www.scien.cx/2021/05/31/css-is/>

VANCOUVER

David Walsh | Sciencx - » CSS :is. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2021/05/31/css-is/

CHICAGO

" » CSS :is." David Walsh | Sciencx - Accessed . https://www.scien.cx/2021/05/31/css-is/

IEEE

" » CSS :is." David Walsh | Sciencx [Online]. Available: https://www.scien.cx/2021/05/31/css-is/. [Accessed: ]

Related Posts