Not CSS selectors

css css-selectors
BlaM picture BlaM · Apr 7, 2009 · Viewed 66.3k times · Source

Is there some kind of "not" CSS selector?

For example when I write the following line in my CSS, all input fields inside an tag with class classname will have a red background.

.classname input {
  background: red;
}

How do I select all input fields that are OUTSIDE of a tag with class classname?

Answer

Peter Boughton picture Peter Boughton · Apr 7, 2009


With current browser CSS support, you can't.

Newer browsers now support it- see Sam's answer for more info.

(See other answers for the alternatives in CSS.)


If doing it in JavaScript/jQuery is acceptable, you can do:

$j(':not(.classname)>input').css({background:'red'});

Related questions

Is there a CSS parent selector?

How do I select the <li> element that is a direct parent of the anchor element? As an example, my CSS would be something like this: li < a.active { property: value; } Obviously there are ways of doing …

Read More
CSS selector for first element with class

I have a bunch of elements with a class name red, but I can't seem to select the first element with the class="red" using the following CSS rule: What is wrong in this selector and how do I correct …

Read More
not:first-child selector

I have a div tag containing several ul tags. I'm able to set CSS properties for the first ul tag only: div ul:first-child { background-color: #900; } However, my following attempts to set CSS properties for each other ul tag except the …

Read More