Search code examples
csscss-selectorschildrenpseudo-class

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

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?

Solution

  • 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)