Problem with page display in Explorer

Question

I have this code (had to split t in 4 sections to display ok):

<div class="list_item" id="item_1">
<div class="list_item_int">Andrés Bedoya</div>
<div class="list_item_big" title="Soy Andr s Bedoya el programador de este maravilloso software">Soy Andr s Bedoya el programador de este maravilloso software</div>
<div class="list_item_big" title="Este es un trabajo de prueba para confirmar que todo funcione correctamente">Este es un trabajo de prueba para confirmar que todo...</div>
<div class="list_item_small"><a href="php/judge_detail.php?work_id=1">Archivos inscritos</a></div>
<div class="eval_buttons">
    <div class="approve" id="approve_1"></div>
    <div class="dismiss" id="dismiss_1"></div>
</div>

<div class="list_item" id="item_2">
<div class="list_item_int">Alexandra Márquez</div>
<div class="list_item_big" title="Soy la esposa de Yo">Soy la esposa de Yo</div>
<div class="list_item_big" title="Prueba corta">Prueba corta</div>
<div class="list_item_small"><a href="php/judge_detail.php?work_id=2">Archivos inscritos</a></div>
<div class="eval_buttons">
    <div class="approve" id="approve_2"></div>
    <div class="dismiss" id="dismiss_2"></div>
</div>

<div class="list_item" id="item_5">
<div class="list_item_int">Pedro Pérez</div>
<div class="list_item_big" title="Prueba o al menos eso creo personaje inventado">Prueba o al menos eso creo personaje inventado</div>
<div class="list_item_big" title="Este trabajo es el tercero de la categorà a Negocios tipo Individual que se escribe y espero que me solucione el problema de las là neas hacia abajo y los botones que se borran">Este trabajo es el tercero de la categorà a Negocios tipo Individual...</div>
<div class="list_item_small"><a href="php/judge_detail.php?work_id=5">Archivos inscritos</a></div>
<div class="eval_buttons">
    <div class="approve" id="approve_5"></div>
    <div class="dismiss" id="dismiss_5"></div>
</div>

<div class="clear"></div>

And this CSS to display it:

.list_item{ height: 48px; line-height: 24px; background: transparent url(images/bg_list_item.png) no-repeat scroll bottom; font-size: 0.7em; float: left; width: 100%; }
.list_item .list_item_int{ float: left; width: 230px; text-align: left; text-indent: 20px; font-size: 1em; font-weight: bold; }
.list_item .list_item_big{ float: left; width: 200px; text-align: justify; margin: 0px 10px 0px 0px; }
.list_item .list_item_small{ float: left; width: 130px; text-align: center; }
.list_item .eval_buttons{ width: 200px; height: 38px; float: left; line-height: 48px; margin-left: 10px; margin-top: 10px; }
.list_item .eval_buttons .approve{ width: 93px; height: 25px; cursor: pointer; background: transparent url(images/boton_aprobar.png) no-repeat scroll top; float: left; }
.list_item .eval_buttons .dismiss{ width: 93px; height: 25px; cursor: pointer; background: transparent url(images/boton_descartar.png) no-repeat scroll top; float: right; }
.list_item a{ color: #195e87; text-decoration: none; font-weight: bold; }
.list_item a:hover{ text-decoration: underline; }

But I keep getting a problem to display it correctly in IE8 while i have no problems with firefox or Google chrome (please take a look at the links to see it):

---

See the problem

is there a way to fix it?

Answer 1

You might try to replace all your floats with elements with fixed with (or percentage width).

Answer 2

What happens id you give .dismiss a float:left too instead of float:right?

Answer 3

Well, Litso was kinda rude, offending my code, but it was ok. He made me realise that i could use another approach to the problem and solve it easily. I created a table and put all the information in trs and tds... this way, the last line never goes wrong and stays where it's supposed to be. Well, thanks to Litso for that. I know my code is kinda poor, and i might suffer of "Divitis", but i'm just a junior programmer.

<tr class="list_item" id="item_1"> 
<td class="list_item_int">Andrés Bedoya</td> 
<td class="list_item_big" title="Soy Andr s Bedoya el programador de este maravilloso software">Soy Andr s Bedoya el programador de este maravilloso software</td> 
<td class="list_item_big" title="Este es un trabajo de prueba para confirmar que todo funcione correctamente">Este es un trabajo de prueba para confirmar que todo...</td> 
<td class="list_item_small"><a href="php/judge_detail.php?work_id=1">Archivos inscritos</a></td> 
<td class="eval_buttons"> 
    <a class="approve" id="approve_1"></a> 
    <a class="dismiss" id="dismiss_1"></a> 
</td>
</tr>