CODEWITHSUNDEEP
css
Poru
Poru

Reputation: 8360

CSS: Work with not()

I have a CSS that looks like this:

a:focus { background-color: #eeeeee; }

Now in CSS3 there's the not() attribute. How could I work with this when I want add the focus-background-color to all elements but with one exception: I want that this isn't added to a-tags/elements inside .audio_wrapper

Upvotes: 2

Views: 139

Answers (3)

Jimmy
Jimmy

Reputation: 37081

The :not pseudo-class won't help you in this situation because it only accepts simple selectors, and your condition relies on an attribute of the a's parent. The best solution is just to define the rule and then override it with a second rule for the conditional case.

Edit: On Second thought, you might be able to do it like this:

:not(.audio_wrapper) a:focus { ...rules... }

Upvotes: 1

Matt Elhotiby
Matt Elhotiby

Reputation: 44066

The not selector is only supported by modern browsers (Firefox, Safari and Opera) and not IE.

a:not(.audio_wrapper){ background-color: #eeeeee; ............}

Upvotes: 0

anthares
anthares

Reputation: 11213

Try with there rules: 

a:focus { background-color: #eeeeee; }
.audio_wrapper a:focus {background-color: #000000}; <!-- or white or what is your default color-->

Upvotes: 2

Related Questions