You are here: Blog » Code Snippets » Using the CSS :not selector

Using the CSS :not selector


Normally in CSS the way to select your desired elements is based on a property or properties which the element has. For example, you might want to select all DIV elements with class “myspecialclass”. However, suppose that you want to select an element in CSS based on the property which an element DOES NOT have. The code below will show you how to achieve this.

The CSS Code

The HTML Code

In the example below, only the second instance will be selected and made red, because this is the only element which matches the “Not” selector of our CSS above


This entry was posted in Code Snippets and tagged by .

Author: justin saad

Justin Saad is first and foremost a husband and a father of four. He is also a web developer and designer who has been making websites for over twenty years. His company is called The Motech Network and his website is In addition to building websites, Justin makes WordPress plugins and likes writing tutorials to help others learn about various aspects of web development.

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">