[SOLVED] 2 boxes within 1 not horizontally inline

<div id="boxone">
<div id="boxonelt">
<img src="assets/topbanner.jpg" width="308" height="200" border="1" class="centerimg" />
<div id="boxoneh1">XXXXtextXXXX</div>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXTEXTXXXXXXXXXXXXXXXXX</div>
<div id="boxonert"></div>
 </div>

#content {
 width: 780px;
 color: #000000;
 display: block;
 margin-top: 0;
 margin-right: auto;
 margin-bottom: 0;
 margin-left: auto;
 

}
#contenth1 {
 background-image: url(assets/H1.gif);
 height: 33px;
 background-repeat: no-repeat;
 background-position: left;
 width: 730px;
 font-family: Arial, Helvetica, sans-serif;
 font-size: 24px;
 font-weight: bolder;
 color: #FFFFFF;
 margin-top: 5px;
 background-attachment: fixed;
 padding-left: 50px;
 padding-top: 7px;
}

.centerimg {
 border: 2px solid #333333;
}

#boxone {
 float: left;
 width: 500px;
 border: 2px solid #CCCCCC;
 margin-left: 7px;
 text-align: center;
 margin-top: 5px;
 font-size: 16px;
 font-weight: normal;
 padding: 10px;
}

#boxoneh1 {
 font-size: 18px;
 font-weight: bold;
 margin: 0px;
 padding: 0px;
}

#boxonelt {
 width: 320px;
 border: medium solid #FF0000;

}
#boxonert {
 float: right;
 width: 50px;
 border: medium solid #FF0000;
 display: none;
}