correct syntax in :not() css

Question

I'm using the current code

#extra-sidebar , .entry-content:not(#post-262){
background-color: rgba(255,255,255,0.8);
}

It actually affects my #extra-sidebar but also my .entry-content entirely. I would like to make an exception for the #post-262 which is affected by the entry-content

Thank you

write your css seperately for .entry-content:not(#post-262) — Aravind30790
– Aravind30790, Commented Jun 25, 2013 at 11:09

David Dayag · Accepted Answer · 2013-06-25 12:12:59Z

2

IE8 and earlier do not support the :not selector.

It's best to just override the class with another class like so:

#extra-sidebar, .entry-content{
   background-color: rgba(255,255,255,0.8);
}

.entry-content #post-262{
   background: none;
}

answered Jun 25, 2013 at 12:12

David Dayag

1,34112 silver badges14 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Niet the Dark Absol · Accepted Answer · 2013-06-25 11:12:07Z

0

Would I be correct in guessing that #post-262 is actually a child of an .entry-content element (or the other way around), and that they are not one and the same?

If so, you will need to define a style for #post-262 that overrides the background colour to the same as whatever's behind the container.

answered Jun 25, 2013 at 11:12

Niet the Dark Absol

326k86 gold badges480 silver badges604 bronze badges

4 Comments

dansayag Over a year ago

.entry-content is for all the posts.

dansayag Over a year ago

#post-262 is <article id> and entry-content is class

dansayag Over a year ago

but if i do this it doesnt work .entry-content { background-color: rgba(255,255,255,0.8); } #post-262 { background-color: transparent; }

Niet the Dark Absol Over a year ago

What exactly do you think transparent is going to achieve? It's like... take a translucent sheet of white plastic and put it on your desk. Everything under it looks washed out, right? Now put some clear plastic on top of that. Does the desk become its original colour again?

Mark · Accepted Answer · 2013-06-28 07:50:45Z

0

Well the way was to use

#post-262 { 
  background-color:#previousvalue!important;
}

No need to use :not() function, !important is enough to set priorities.

edited Jun 28, 2013 at 7:50

Mark

6,8731 gold badge35 silver badges51 bronze badges

answered Jun 27, 2013 at 13:45

dansayag

771 gold badge3 silver badges8 bronze badges

Collectives™ on Stack Overflow

correct syntax in :not() css

3 Answers 3

Comments

4 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

4 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related