Messed up floats

I have no idea what is causing this staggered floats seen here. And the bg color of navbar_left isn’t even showing.
Here’s the CSS:


body {
margin:0px;
background-color:#999999;

}

.wrapper {
width:760px;
position:absolute;
left:50%;
margin-left:-380px;
padding:0px;
border:0px;
background-color: #ffffff;
}
 
.navbar_left {
width:180px;
background-color:#33FF99;
float:left;
}

.content {
width:580px;
background-color:#CC0066;
float:right;
}

.headers {
width:760px;
background-color:#00FF00;
}