3 Divs in the same Row CSS/HTML

In CSS file

#headerdiv
{
height: 53px;
background-color: #87CEEB;
}
#headerleft
{
float: left;
height: 53px;
width: 500px;
position: relative;
z-index: auto;
}
#headerMiddle { float:left; height: 53px; }
#headerright
{
float: right;
height: 53px;
width: 20px;
position: relative;
z-index: auto;
}



In HTML Page

<div id="headerdiv">
<div id="headerleft">Left</div>
<div id="headerMiddle">Middle</div>
<div id="headerright">Right</div>
</div>