CSS class not having an effect on a div
- by ETFairfax
Hi Peeps,
The following is an section of my css file plus some HTML. Can anyone tell me when I put class="containerHeader selected" (as is on Test Header A) the background colour is not being set to Red???
Cheers,
ET Fairfax.
div#builderContainer
{
margin-top: 15px;
width: 390px;
height: 700px;
border: solid 0px #CCCCCC;
background-repeat: no-repeat;
}
div#builderContainer .container
{
display: none;
-moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; /* Corner radius */
border: solid 1px #999999;
}
div#builderContainer .container div:hover
{
background-color: #EEEEEE;
}
div#builderContainer .containerHeader
{
-moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px;
background: #93c3cd url(images/ui-bg_diagonals-small_50_93c3cd_40x40.png) 50% 50% repeat;
border-bottom: solid 0px #999999;
margin: 0px;
margin-top: 25px;
padding: 10px;
/* display: none; */
border: solid 1px #999999;
font-weight: bold;
font-family: Verdana;
background-color: #FFF;
cursor: pointer;
vertical-align: middle;
}
div#builderContainer .containerHeader:hover
{
background: #ccd232 url(images/ui-bg_diagonals-small_75_ccd232_40x40.png) 50% 50% repeat;
}
div#builderContainer .containerHeader:active
{
background: #db4865 url(images/ui-bg_diagonals-small_40_db4865_40x40.png) 50% 50% repeat;
}
div#builderContainer .containerHeader .selected
{
background-color: Red;
}
<div id="builderContainer">
<div class="containerHeader selected" id="CHA">Test Header A</div>
<div class="container" id="CA"></div>
<div class="containerHeader" id="CHB">Test Header B</div>
<div class="container" id="CB"></div>
</div>
