Problem with float

[ChocolateLover]

Hi

I have a box with information and an image. I would like the box that contains the info aligned left (OK) and the image aligned right at the same level. The image is aligning right, but below the level of prodDetails.
CSS
#prodDetails {
font-size: 100%;
padding: 5px 5px 5px 5px;
border: #7794b7 1px solid;
max-width:200px;
}


ul#prodDetailsList {
list-style-type: none;
margin: 0px 10px 0px 10px;
padding: 0px;
}

#prodDetails .container {
display:block;
border: #acd2ca 1px solid;
vertical-align: bottom;
}

#prodImageBox {
text-align:center;
}


.prodImage {
float:right;
background: url(css/images/shadowAlpha.png) no-repeat bottom right !important;
background: url(css/images/shadow.gif) no-repeat bottom right;
margin: 10px 0 0 10px !important;
margin: 10px 0 0 5px;
}


.prodImage img {
display: block;
position: relative;
background-color: #fff;
border: 1px solid #a9a9a9;
margin: -6px 6px 6px -6px;
padding: 4px;
}

#prodDetails .buyImage {
float:right;
}

HTML
<!--product details begin -->
<div id="prodDetails">
<div class="container">
<input type="hidden" name="products_id" value="1"/><input type="image" src="includes/languages/english/images/buttons/buy.gif" border="0" alt="Add to Basket" title=" Add to Basket " class="buyImage"/> <ul id="prodDetailsList">
<li><h2>Matrox G200 MMS</h2></li>
<li class="smallText">[MG200MMS]</li> <li>$299.99</li>
</ul><!--id="prodDetailsList" -->
</div><!--class="container" -->
</div><!--id="prodDetails" -->
<!--product details end -->

<!--product image begin -->
<div class="prodImage">
<a href="http://localhost/blue_owl/images/matrox/mg200mms.gif?bod=fc6ee0b4230d52cac053b97d8bc5e263" target="_blank"><img src="images/matrox/mg200mms.gif" border="0" alt="Matrox G200 MMS" title=" Matrox G200 MMS " width="100" height="80" /></a></div>

<!--product image end -->


Can anyone see what the problem is?

Thanks.

[ray326]

The two divs have to be narrow enough to sit side by side.

[ChocolateLover]

Yes, they're both narrow enough to fit. I've tried them both with a width of 100px and there's nothing else on the page.