problemi con resize IE6

[kapy79]

salve a tutti,
ho un problema, ho questa struttura:

<div id="header">
<div id="logo">


[img]images/logo.png[/img]</p></div>

<div id="benvenuto">


[img]images/omino.png[/img]Buongiorno PINCO PALLINO</p></div>

<div id="bnl">

[img]images/logo-bnl.png[/img]</p></div>

</div>

Si vede tutto bene, ma il problema è che con IE6 quando faccio il resize della finestra gli elementi si dispongono tutti uno sotto l'altro creando un bruttissimo spazio bianco, mentre con con IE 7 si dispongono uno sull'altro senza andare a capo...
siccome ho necessità di ottimizzare anche con IE6...AIUTOOOOOO!!!

questo è il css:

#header
{
height: 130px;
width: 100%;
background-image: url('../images/bg-header.gif');
background-repeat: repeat-x;
text-align:center;
border: 1px #d6d6d6 solid;
}

#logo
{
margin:0px;
width:15%;
height:100px;
float:left
}

#logo p
{
margin-top: 20px;
padding:0px;
float:left
}

#benvenuto
{
margin:0px;
width:60%;
height:100px;
float:left;
text-align:right
}

#benvenuto p
{
margin-left: 200px;
margin-top: 45px;
margin-right:0px;
color: white;
padding:0px;
}

#benvenuto input
{
margin-left: 5px;
margin-right:5px;
padding:0px;
}

#benvenuto img
{
margin-right:3px;
}

#bnl
{
margin:0px;
width:15%;
height:100px;
float:right
}

#bnl p
{
margin-top: 18px;
padding:0px;
float:left
}

[fcaldera]

a occhio credo che il tuo problema principale sia l'aver definito width:100% a header che contiene blocchi in float. Se definisci la sua larghezza in pixel la situazione migliora in termini di "slittamento"?

anche floattare i paragrafi non è una buona idea, soprattutto considerando che 1) dovresti dare una larghezza anche ad essi 2) più elementi floattati ci sono in pagina e più IE6 può comportarsi in modo incoerente nella resa di alcuni elementi.

inizia a mettere uno sfondo colorato ai vari blocchi e cerca di capire se alcuni blocchi debordano rispetto ad altri perchè non correttamente dimensionati.

[kapy79]

Originariamente inviato da fcaldera
a occhio credo che il tuo problema principale sia l'aver definito width:100% a header che contiene blocchi in float. Se definisci la sua larghezza in pixel la situazione migliora in termini di "slittamento"?

anche floattare i paragrafi non è una buona idea, soprattutto considerando che 1) dovresti dare una larghezza anche ad essi 2) più elementi floattati ci sono in pagina e più IE6 può comportarsi in modo incoerente nella resa di alcuni elementi.

inizia a mettere uno sfondo colorato ai vari blocchi e cerca di capire se alcuni blocchi debordano rispetto ad altri perchè non correttamente dimensionati.

prima di tutto grazie per la risposta.
Allora, ho provato a dichiarare la larghezza in pixel e così funziona, purtroppo però devo seguire lo standard richiesto e usare le percentuali. Ho provato a togliere la larghezza ed i float ai paragrafi ma non cambia nulla...

[kapy79]

emmh...non so se va bene ma ho risolto togliendo i float ai paragrafi e applicando il clear right al livello centrale

#benvenuto
{
margin:0px;
width:60%;
height:100px;
background-color:red;
text-align:right;
float:left;
clear:right
}

e left all'ultimo livello

#bnl
{
margin:0px;
width:5%;
height:100px;
background-color:yellow;
clear:left;
float:right
}


ma onestamente non mi spiego proprio perchè così funzioni...