Height issue in IE7/FF3

[williamZanelli]

Hi guys,

 

I have a IE7/FF3 issue,

 

I have some text, sourrounded by a border,

 

The structure of this as below

<div id="display_message_item">
<div id="list_left">
<p>by :: 767</p>

<p> Enter your text here. Enter your text here. Enter your text here. </p>
</div>
<div id="list_right">
<img src="images/thumb_down.jpg" />
<img src="images/thumb_up.jpg" />

 

The CSS is as follow

#display_message_item{
border: solid 1px #666666;
min-height: 90px;
margin: 10px 0 10px 0;
padding-bottom: 5px;

#list_left{
float:left;
width: 390px;

}

#list_right{
width: 80px;
float:right;

}

 

This works as I want it in IE7, but in FF3 the box doesn;'t change to accomdate the hieght..

 

Any ideas on how I could tackle this?

 

Thanks in advance

 

Will

[Wolphie]

Don't use float.

 

<div id="display_message_item">
<div id="list_right">
<img src="images/thumb_down.jpg" />
<img src="images/thumb_up.jpg" />
</div>
<div id="list_left">
<p>by :: 767</p>
<p> Enter your text here. Enter your text here. Enter your text here. </p>
</div>

 

#display_message_item{
border: solid 1px #666666;
min-height: 90px;
margin: 10px 0 10px 0;
padding-bottom: 5px;
}

#list_left{
width: 390px;
}

#list_right{
width: 80px;
float:right;
}

[williamZanelli]

Thanks for this, it works I wanted it.

 

My question is.. why shouldnt i use the float?