Markasoftware Markasoftware - 1 year ago 56
CSS Question

Can't use children with :not pseudo selector

I'm having trouble using some relatively simple CSS selectors using

. Namely, the following selector is giving me an error:

a:not(.ebook_document *)

I am trying to get all
elements that are not children of the element with class
. This also fails:

a:not(.ebook_document > *)

As well as this:

a:not(.ebook_document, *)

Putting the selectors on their own, not in a
section works fine. What have I done wrong?

Answer Source

:not only takes a simple selector. (For now, CSS 4 expands that to a selector list.)

Plus, -

This selector only applies to one element; you cannot use it to exclude all ancestors. For instance, body :not(table) a will still apply to links inside of a table, since will match with the :not() part of the selector."

What you want is not possible using :not.

You can only go about it the other way around - format all "normal" links, and then apply different formatting for the links inside the target element(s) using .ebook_document a { ... }

So that means rather than not applying styles to those links in the first place, you might need to overwrite the styles you don't like for those links again.

(Or use initial/all to actually reset styles, but browser support for that is still lacking AFAIK.)

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download