Question about nested CSS? -

i have box center, , want color box differently depend on page. try this

#center {     margin-top: 2px;     padding: 10px 20px;    /* cc padding */     width: 100%;     height: 800px;     color: black;     font-size: 11px;         } #backgroundred{     background-color: red; } #container {     padding-left: 200px;   /* lc fullwidth */     padding-right: 240px;  /* rc fullwidth + cc padding */ } #container .column {     position: relative;     float: left; } 

so try this

    <div id="containder">         <div id="backgroundred">             <div id="center" class="column">             abc                </div>         </div>     </div> 

however background of box not turn red, explain me did wrong? btw, must have class="column"

maybe wanted rule?

#backgroundred div#center {     background-color: red; } 

that means "if div#center child of #backgroundred..."

your example should make outer div have red background.