CSS Selector for not a child of element type?

css css-selectors
bevacqua picture bevacqua · Feb 15, 2013 · Viewed 81.6k times · Source

I want to style code elements that are not inside a tags.

What is the best approach to accomplish this?

code:not(a code) doesn't seem to work at all, at least on Chrome, even though it seems like it should

I can't get it to work from the console either.

Are there any other css-only approaches I could use for this?

Answer

Joseph Silber picture Joseph Silber · Feb 15, 2013

:not does not support combinator selectors.

If we're talking about its direct parent:

:not(a) > code

Otherwise there's no way to do this in CSS. You'll have to override it:

code {
    /* some styles */
}

a code {
    /* override previous styles */
}

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