Problema con float

[damy11]

Ciao a tutti

#testicon {
display: block;
width: 100%;
border-bottom: 1px solid #000;
clear: both; }

#testo_ita {
display: block;
width: 300px;
margin: 10px auto 0 auto; }

#box_en {
display: block;
width: 450px;
height: 100%;
border-right: 1px solid #000; }

#testo_en {
padding: 10px 0 10px 30px; }

#box_trad {
display: block;
width: 430px; }

#trad {
padding: 10px 0 10px 30px; } 

pagina

<div id="testicon">
<div id="box_en">
<div id="testo_en">
testo
</div></div>
<div id="box_trad">
<div id="trad">
traduzione
</div></div> 

Dovrei ottenere il testo sulla sinistra e la traduzione sulla destra divisi dal bordo sinistro di box_en,invece accade che la traduzione finisce sotto il testo...come posso risolvere?

[Prill]

Ciao, assegna a #box_en e box_trad un float (left a entrambi o a quello di sinistra left e all'altro right). #testicon per contenerli affiancati dovrà almeno avere una larghezza di 882 pixel (450 + 430 + 2 di bordo)

[damy11]

Ciao ho provato come dici tu,ma "testicon" assume come valore in altezza 1,cioè non racchiude i due box,proprio perchè con i float questi vengono tolti dal normale flusso della pagina...come posso risolvere?

#testicon {
display: block;
width: 882px;
border-bottom: 1px solid #000;
clear: both; }

#box_en {
display: block;
float: left;
width: 450px;
height: 100%;
border-right: 1px solid #000; }

#box_trad {
display: block;
float: right;
width: 430px; } 

[Prill]

Con un'interruzione del float, cerca qui nel forum clear o clearfix