how can i use the css ".not()" on a element and its children

Question

i have a contact webpage, in it i have a div with some css applied to that specific div using its id, i want to use this styling for more divs which i am going to add, but only direct descendants of body. however i have a header div, which i use on all my pages on this site, and i dont want this styling to apply to it, or its children.

how can i use the css :not() selector, on the #header div and on its children?

letiagoalves · Accepted Answer · 2013-09-12 09:05:20Z

5

CSS selector for all DIV elements except #header:

div:not(#header) { }

CSS selector for its children

div:not(#header) > * { }

or for all its descendants

div:not(#header) * { }

Edit

CSS selector for all DIV elements that are body childs except div#header

body > div:not(#header)

edited Sep 12, 2013 at 9:05

answered Sep 12, 2013 at 8:35

letiagoalves

11.3k4 gold badges42 silver badges68 bronze badges

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

8 Comments

Math chiller Over a year ago

your answer messes up everything else on my page. borisute.com/geshem/2013/mkeller/myself.html - see it yourself.

letiagoalves Over a year ago

@tryingToGetProgrammingStraight well, you used div:not(#header) * so it applied to all descendants. Use div:not(#header) > * instead.

Math chiller Over a year ago

yes i did it, it works. i still dont understand why that had anything to do, whats the connection between #header descendants and all ot her elements?

letiagoalves Over a year ago

descendants are all elements inside itself, but when you explicitly use > to select only its children the style rule will stop there (1st level) and it will not be applied to every element inside.

Math chiller Over a year ago

ummm... i noticed that the css isnt being applied to the div - its being applied to the children??? at least according to firebug.... and chrome developers tool... umm help?

|

Collectives™ on Stack Overflow

how can i use the css ".not()" on a element and its children

1 Answer 1

8 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

8 Comments

Your Answer

Sign up or log in

Post as a guest

Related