Conditional CSS: if sibling's child div is present, then -

in html fragment below, want "main" div have background image if "menu" div not present in markup. possible?

<div class="header">     <div class="sitetitle">site title</div>     <div class="tagline">site tagline</div>     <div class='menu'></div> </div> <div class="main"></div> 

http://www.w3.org/tr/css3-selectors/

e + f matches f element preceded sibling element e. e:not(s) e element not match simple selector s

edit :not uses simple selector, unfortunately can't use filter properties of children, attributes of element.

a simple selector either type selector, universal selector, attribute selector, class selector, id selector, or pseudo-class.

you put .empty class on menu , still use it.

.header .menu:not(.empty) + .main {    background:pink; } 

this solution best of both worlds, javascript using css per normal.

javascript:

if ($('.menu').length == 0){     $('body').addclass('no_menu'); } 

css :

body.no_menu .main{     background:pink; }