Siwicki

New CSS Selectors

April 29, 2015

Today, I was trying do a few things in CSS that just wouldn’t work across all browsers. This started me doing a little research whole to find some new selectors. I found a few things worth noting and getting excited about.

:required and :optional - This is for use for forms that are required and just optional. A nice way to style warning messages when you are using the HTML 5 form validation.

:matches() - This selector looks like its purpose is to simply things. It is mainly used for grouping things together.

.special h1, article h1, aside h1 {
    color: red;
}
/*same as */
:matches(.special, article, aside)  h1 {
    color: red;
}

John SiwickiWritten by John Siwicki who lives and works building interesting things. You should follow him on Twitter