Alingment Issue

What I am trying to do is create a page where the top and left sides are shaded. I have two created two divisions, the top…

[code]
#ahead
{
width: 800px;
height: 60px;
background-color: #996666;
border: 2px solid #663333;
font-family: tahoma;
font-size: 20px;
font-weight: 600;
color: #663333;
text-align: center;
}[/code]

and the left side…

[code]
#abar
{
margin-top: 0px;
width: 100px;
background-color: #996666;
border: 2px solid #663333;
font-family: tahoma;
font-size: 16px;
font-weight: 600;
color: black;
text-align: center;
float: left;
}[/code]

But when I call the two division in my html…

[code]<div id=”ahead”>Some Content</div>
<div id=”abar”>Some More Content</div>[/code]

I get about a 2 pixel gap between the two. The result is that rather than having the top and left sides shaded, I have the top shaded, then a break, then the left side shaded. What am I missing?

Also in #CSS _↴