csscss-selectors

CSS Selector for not a child of element type?


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?


Solution

  • :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 */
    }