Tre div all'interno di un altro div - problema IE

  • Creatore Discussione Creatore Discussione Eugene
  • Data di inizio Data di inizio

Eugene

Utente Attivo
5 Mag 2005
110
0
16
56
Dagobah
www.yodastudio.com
Buongiorno!

Ecco cosa abbiamo oggi:
un div "header" che contiene a sua volta tre div "left - center- right".
Il div "center" contiene un filmato flash.
Il problema è che, mentre con NN, FF e opera i tre div vengono posiszionati tutti alla stessa altezza (all'interno del div "header"), con IE il div centrale viene posizionato sotto i due laterali.
Eppure questo non dovrebbe accadere.
Ho provato a non includere il filmato flash in un div ma lasciarlo "libero" all'interno del div "header".
Ancora una volta, con i tre browser sopra menzionati nessun problema, mentre con IE il problema rimane invariato.

Ecco il codice html:

<div id="container">
<div id="header">
<div id="headerLeft"></div>
<div id="headerRight"></div>
<div id="headerCenter">
<object type="application/x-shockwave-flash" data="home.swf" width="690" height="366">
<param name="movie" value="home.swf" />
</object>
</div>
</div>
</div>

e quello css:

div#container{
width: 759px;
margin: 5px auto 0px;
background-color: #C0C1D6;
}

div#header{
height: 366px;
margin: 0px;
padding: 0px;
text-align: center;
}

div#headerLeft{
height: 366px;
width: 30px;
background-image: url(../images/head_left.gif);
float: left;
margin: 0px;
padding: 0px;
}

div#headerRight{
width: 39px;
height: 366px;
background-image: url(../images/head_right.gif);
float: right;
margin: 0px;
padding: 0px;
}

Ho attribuito vari valori al div "headerCenter" ma senza successo perchè mi sono reso conto che non cambia nulla.
O meglio, potrei dargli delle coordinate assolute ed a quel punto lo posizioni dove voglio, ma non capisco perchè così non debba funzione soprattutto perchè il problema è solo con IE. Cribbio!

Grazie.
 
Ultimi esperimenti mattutini hanno confermato che IE inserisce uno spazio di qualche pixel tra i div.

E' stato sufficiente assegnare un bordo colorato per verificarlo.
In questo modo, è comprensibile che i tra div sballino una volta assegnata una larghezza in pixel a quello centrale (div container = 759; left + center + right = 30+690+30 = 759 + spazio inserito da IE).

A uqesto punto dovrei capire come eliminare questo spazio superfluo per risolvere il problema, ma con i vari padding, margin e border non ottengo risultati.

Aiuto!
 

Discussioni simili