problema overflow firefox Vs. IE

[bolivio]

salve a tutti,
ho fatto una ricerca veloce ma non ho trovato problemi simili ai miei...

ho un problema con la proprietà overflow dei div...

ho più div uno sopra all'altro, tipo righe di una tabella, generati da un ciclo (PHP)...
con un javascript modifico la proprietà overflow in quando il div contiene un testo molto più lungo di una sola riga. Settando la proprietà a "visible" vorrei far si che i div sottostanti scorressero verso il basso senza sovrapporsi...

p.s. con explorer funziona correttamente, con Firefox quando metto la proprietà a visible i div che si allunga passa sopra a tutti gli altri e viene un pastrocchio.

p.p.s. firefox è comunque il meglio

[Mich_]

Sembrerebbe un errore di posizionamento. Prova a postare il CSS e l'HTML dei blocchi coinvolti, oppure un link.

[bolivio]

Questo è parte del mio codice...in pratica su firefox il div1 si sovrappone agli altri mentre su IE funziona correttamente

<script language="JavaScript" type="text/JavaScript">
<!--
function apridiv(divname) {
if (document.getElementById(divname).style.overflow == 'hidden') {
document.getElementById(divname).style.overflow = 'visible';
}
else {
document.getElementById(divname).style.overflow = 'hidden';
}
}
//-->
</script>

....

<a href='#' onclick="apridiv('div1');">

<div id='div1' style='height:20px; width:670px; overflow: hidden;'>qui c'è una tabella di 5 righe</div>
<div id='div2' style='height:20px; width:670px; overflow: hidden;'>qui c'è una tabella di 5 righe</div>
<div id='div3' style='height:20px; width:670px; overflow: hidden;'>qui c'è una tabella di 5 righe</div>

[Mich_]

Il bug e` di IE: interpreta height come fosse min-height.

Quindi il CSS corretto sarebbe:

min-height:20px; 
width:670px; 
overflow: hidden;

per farlo funzionare anche con IE, puoi usare:

height: auto !important;
height: 20px;
min-height:20px; 
width:670px; 
overflow: hidden;

Oppure utilizzare i commenti condizionali (sarebbe preferibile).

[bolivio]

Scusami, forse non mi sono spiegato bene...il div1 (come del resto gli altri) ha un'altezza iniziale di 20px, mentre il contenuto sottostante è invisibile perchè l'opzione overflow è hidden. Quando viene cliccato il link, il div1 si deve espandere verso il basso non sovrapponendosi agli altri, i sottostanti div devono scorrere verso il basso. Ribadisco che con IE il mio codice funziona con FIREFOX NO!!!

Posto un'immagine esplicativa al riguardo!

[Mich_]

Scusa, non avevo badato al JS (e quindi avevo interpretato diversamente)

Ma perche` utilizzi JS per fare una cosa che puo` fare (meglio) CSS da solo?

Prova a vedere alcuni dei menu contenuti tra i "link utli": alcuni hanno quell'effetto di espansione all':hover


E comunque rimango dell'idea che stai usando i posizionamenti in maniera non corretta.