asked on

Background positioning with css in div

Hi I have the below html. There is a graphic in the div id="Header". I want to put the div's for classes photobox for the graphics in the div officers on the bottom portion (over it) of the header.

You can see this live at http://www.cleanslatelocal118.com/index.aspx

<body>
<div id="Wrapper">
<div id="Header"></div>
<div class="clear"></div>
<div id="officers">
<div class="photobox"><img class="photo" src="images/a.png" alt="" />text</div>
<div class="photobox"><img class="photo" src="images/b.png" alt="" />text</div>
<div class="photobox"><img class="photo" src="images/b.png" alt="" />text</div>
<div class="photobox"><img class="photo" src="images/d.png" alt="" />text</div>
<div class="photobox"><img class="photo" src="images/e.png" alt="" />text</div>
<div class="photobox"><img class="photo" src="images/f.png" alt="" />text</div>
<div class="photobox"><img class="photo" src="images/g.png" alt="" />text</div>
<div class="photobox"><img class="photo" src="images/h.png" alt=""/>text</div>
</div>
</div>
</body>

CSS for this is:

#Wrapper
{
margin: 0 auto;
max-width:1200px;
}

#Header
{
margin: 0 auto;
width: 1100px;
height: 455px;
background: url(images/background.png) 0 0 no-repeat;
float:left;
}

#officers
{
background-color:#294143;
height:200px;
width:1100px;
float:left;
}

.photobox
{
height:200px;
width:105px;
padding:10px 3px 3px 3px;
text-align:center;
float:left;
font-family:Calibri;
font-size:.7em;
color:White;
}

.clear
{
clear:both;
}

ASKER CERTIFIED SOLUTION