codice css:
codice:
p{margin: 0 15px;padding: 0 0 0.7em}

div#bianco, div#bianco_alto, div#bianco_centro, div#bianco_basso{width:502px;}
div#bianco{float:left;margin-right:12px;}

div#bianco_alto{height:14px;background: url(images/bianco_alto.gif) repeat-x;}
div#bianco_centro{background: url(images/bianco_centro.gif) repeat-y;height:100%;}
div#bianco_basso{height:16px;background: url(images/bianco_basso.gif) repeat-x;;}
	
div#footer{clear:both;width:100%;}

div#sinistra{float:left;margin-right:12px;width:230px;}
div#destra{float:right;width:230px;position:relative;}
codice html:
codice:
<DIV id="bianco">
	<DIV id="bianco_alto"></DIV>
	<DIV id="bianco_centro">
		<DIV id="sinistra">

sinistra</p></DIV>
		<DIV id="destra">

destra></p></DIV>
	</DIV>
	<DIV id="bianco_basso"></DIV>
</DIV>
il risultato è il seguente: Risultato_01

Come si può notare firefox non interpreta i div "sinistra" e "destra" come fossero del testo ma li visualizza sovapponendoli a "bianco" (che è il div principale), mentre MIRACOLOSAMENTE ie interpreta correttamente il codice. Come fare per ottenere lo stesso risultato?!

Ho provato aggiungendo "position:absolute;" al div in cui sono contenuti ("bianco_centro") eliminato "height:100%" e successivamente ho aggiunto "position:relative;" a "destra" e "sinistra" e il risultato è questo: Risultato_02
ovvero un risultato pressoché identico ma sbagliato, dato che scompare il div "bianco_basso" e il footer cambia posizione...


...solita domanda finale: che fare?!
Chi mi aiuta offro una pizza e una birra (virtuali )