At my oft refered-to page found HERE, I have a great many nested divs on the right-hand side that contain links to my on-line store.

For the life of me, I cannot get the header div (the ones called "Ford", "Chevy", and so on) to center and align with the rest of the other divs. I have torn apart my css and xhtml, but I cannot find the problem. Quite possibly, the offending attribute/code is right in front of me, but I can't see it.

Also, I have specified in my stylesheet that the width of the div.header be the same as the div.cell class, which is really what I want, but it doesn't display that way.

HTML:
Code:
<div id="myTables">
  <div id="ford" style="z-index: 1">
    <div class="header" style="color: #ffffff">Ford Trucks:</div><br />
       <div class="cell">
        <a class="span" href="...">
         <span class="cell"><span class="left">
          <b><span style="color: red">1150R</span>
          &nbsp;&nbsp;&nbsp;1980-1996&nbsp;&#189;  Ton
          </b></span>
         </span></a>
	<a class="spam" href="....">
	 <span class="cellpkg">
	  <b><span style="font-family: webdings">4</span></b>
           &nbsp;1150R and brake control <b>pkg</b>
	 </span></a></div>
</div>
My Styles:
Code:
div.header {
	background-color: navy;
	cursor: default;
	font-size:10pt;
	text-align: center;
	border:1px solid navy;
	font-variant: small-caps;
	width: 220px;
	padding:2px 0px 2px 0px
	}

div.cell {
	cursor: pointer;
	font-size:8pt;
	width: 220px;
	margin-bottom: 2px;
	padding:2px 10px 0px 0px
	}

span.cell {
	cursor: pointer;
	display: block;
	font-size:8pt;
	width: 220px;
	border:1px solid black;
	margin-bottom: 2px;
	padding:2px 10px 2px 0px
	}

span.cellpkg {
	cursor: pointer;
	display: block;
	text-align: right;
	font-size:8pt;
	border:1px solid black;
	width: 220px;
	margin: 0px 0px 7px 0px;
	padding:2px 10px 2px 0px
	}

span.left {
	display: block;
	text-align: left;
	}

span.right {
	display: block;
	text-align: right;
	}

#ford, #chevrolet, #dodge, #toyota, #other {
	position: absolute;
	top: 5px;
	left: 5px;
	width: 250px;
	height: 600px;
	background-color: #ffffff;
	z-index: 0;
	}

#myButtons {
	text-align: center;
	font-size: 9pt; 
	font-family: verdana, arial, courier;
	text-decoration: none;
	background-color: #ffffff; 
	float: left;
	margin: 10px 0px 20px 0px;
	top: 10px; left: 0px; width: 250px; height: 660px;
	visibility: visible;
	z-index: 1;
	}

#myTables {
	font-size: 9pt; 
	font-family: verdana, arial, courier;
	text-decoration: none;
	background-color: #ffffff; 
	position: absolute;
	top: 237px; left: 1px; width: 250px; height: 600px;
	visibility: visible;
	z-index: 1;
	}
Any solutions?
Cheers.