In effetti IE è un browser che definire strano è dir poco...è semplicemente scandaloso!VVoVe:
Per il tuo problema è presto detto...e stavolta (strano ma vero!) non è del tutto colpa di IE.
Quando dichiari flottante anche l'header, una volta che il browser termina la lettura dei 2 box #logo e #logo2 (entrambi flottanti) rimane con l'allineamento "sporco", perché #header è flottante a sua volta e siccome lo è anche il box successivo (#contenitore), il browser li affianca! Per risolvere il problema devi "pulire" l'allineamento flottante di #header, in modo da ripristinare il normale flusso del documento e fare in modo che il successivo box (flottante) sia scritto sotto di esso. Per fare questo, ti basta usare un elemento <div> con altezza 0 oppure, meglio ancora, un
(evita l'<hr> che, sebbene corretto semanticamente, non ha un box model ben definito e ti costringerebbe ad annidarlo dentro un <div> per essere reso invisibile impostanto a 0 la sua altezza).
Ti conviene aggiungere una classe "clear" nel tuo CSS in questo modo:
Il tuo codice XHTML va quindi modificato così:codice:.clear { clear: left; }
L'elementocodice:<div id="header"> <div id="logo">..logo..</div> <div id="logo2">..logo2..</div> </div> <br class="clear" /> <div id="contenitore"> <div id="colonna1">..menu..</div> <div id="colonna2">..contenuto..</div> </div> <div id="footer">..footer..</div>
inserito in questo modo non genera un "ritorno a capo" perché pulisce l'allineamento di un box flottante e ripristina il flusso normale del documento nel punto in cui è inserito.
Ciao! E...non vorrei scoraggiarti, ma con IE dovrai prepararti ad avere spesso mal di testa se ti sei avvicinato da poco ai CSS...![]()