Problema ie8 e menu a comparsa!

[Madsex]

Salve, ho un problema con un menu che si presenta solo con ie8 e famiglia, con tutti gli altri(e dico proprio tutti) non si presenta.

Ho questo tipo di struttura:

<div id="container">
<div id="left"></div>
<div id="middle"></div>
</div>

ad ogni id è assegnato del codice css:

#container{margin:auto;width:950px; height:auto;border:1px solid blue;}
#left{margin-left:0;width:215px;min-height:500px;float:left;border:1px solid red;}
#middle{width:690px;height:500px;float:left;border :1px solid green;}

All'interno di left c'è un menu in javascript e css che al click su un opzione apre un div contenente delle sottocategorie.
Nel caso in cui si utilizzi ff safari o chrome il div left si allunga e se il suo contenuto fa superare l'altezza minima di container, anche container si allunga.

Questo non avviene con IE8(non oso immaginare con gli altri della famiglia.
Infatti con suddetto browser left si allunga mentre container no,facendo finire il menu sopra i contenuti presenti al disotto di container(spero di aver reso l'idea).

Come cavolicchio posso fare?
La cosa che ho notato è che se metto la visualizzazione per vecchi siti di IE8 l'allungamento del container avviene normalmente(tutto il resto della pagina però è uno obrobrio indicibile).

Grazie per un qualunque aiuto!

[Madsex]

Proprio nada?Almeno sapreste dirmi se è un problema di browser o se sono io che sono una pecora?

Grazie cmq!

[sandrone65]

Quando imposti un div come float (left e middle) lo rimuovi dal normale flusso del documento e lo sposti su uno dei lati.
Per questa ragione sia con IE che con FF visualizzando il tuo esempio vedi il container come fosse una semplice riga blu, perchè non ha dimensioni verticali, dal momento che i suoi contenuti sono stati rimossi dal flusso e dal momento che non hai impostato alcuna dimensione verticale al container stesso.

Per cui è normale che allungando left il container non segua l'allungamento, caso mai non si capisce perchè FF lo faccia (sicuramente c'è dell'altra roba nella tua pagina).

Prova a vedere se inserendo un clear nel punto giusto il problema scompare, in questo modo:

<div id="container">
<div id="left"></div>
<div id="middle"></div>
<div style="clear: both;"></div>
</div>

[Madsex]

Niente da fare neppure con il div con clear:both il menù quando si allunga sovrasta sempre il contenuto sottostante.
Vorrei precisare una cosa nell'esempio il container ha height:auto; in realtà ho dato un min-height al container e questa soluzione funziona benissimo con tutti i browser tranne con ie8.
Infatti con gli altri browser quando allungo il menu il container si allunga e si contrae a seconda dei contenuti del menu.

Onestamente non so pià che pesci prendere!

Grazie per qualunque altra dritta!

[ResianTaxidrive]

prova a dare float:left anche al container e magari togli height:auto;