[Resolved] [CSS] DIV layouts/Text Layout Problem

[beaver6813]

[CSS] DIV layouts/Text Layout Problem

EDIT: Fixed by defining a width for the search-description div, seems firefox wants to be told a width and IE does what it wants anyways so it didn't notice i forgot the width variable. :P

Hey,

Firstly, this problem does not occur in ie7/6... for some reason only in FF (im running firefox 2), but there must be a problem with my css

The code below is what im using to display one search result:

<div class="search-result">

  <a href="./?t=p&c=20003" title="Watch Ultimate Football"><img name="Ultimate Football Thumbnail" width="60" height="60" alt="Watch Ultimate Football" src="http://localhost/removed/20003.png" border="0" class="search-image"></a>

<div class="search-info">
<a href="./?t=p&c=20003" title="Watch Ultimate Football">Ultimate Football | Date Added: </a>
</div><br>
<div class="search-description">
<a href="./?t=p&c=20003" title="Watch Ultimate Football">
Watch this extroadinary America Football game. It is really not one to miss and is really really great!
</a>
</div>

The thumbnail is meant to be on the left, then info on the right of it at the top, then description below the info But for some reason if there is more than 2 lines of text it shoves the description below the thumbnail :S

CSS Used:

/*Search Display Styling*/
.search-result{
border:1px #000000 solid;
width:97%;
float:left;
margin-bottom:15px;
padding:2px 2px 2px 2px;
background-color:#00375F;
}
.search-image{
float:left;
border:1px #000000 solid;
display:inline;
}
.search-info{
float:left;
font-weight:bold;
padding:0 0 0 4px;
display:inline;

}
.search-info a:hover{
text-decoration:none;
}
.search-description{
float:left;
display:inline;
height:auto;
padding:0 0 0 4px;

}
.search-description a:hover{
text-decoration:none;
}

Please help!