Ciao. Ho un problema con i box css della mia pagina. Sto cercando di impaginare un layout x il sito Zen Garden (http://csszengarden.com/) che sicuramente qualcuno conoscerà. Beh, comunque... il pezzo di codice html è il seguente:
codice:
<div id="container">
<div id="intro">
<div id="pageHeader">
<h1><span>css Zen Garden</span></h1>
<h2><span>testo</span></h2>
</div>
<div id="quickSummary">
<p class="p1"><span>testo</span></p>
<p class="p2"><span>testo</span></p>
</div>
<div id="preamble">
<h3><span>testo</span></h3>
<p class="p1>testo</span></p>
<p class="p2"><span>testo</span></p>
</div>
</div>
</div>
e il mio css è il seguente:
codice:
#container {
width:720px;
margin: 0px auto;
text-align:left;
background:url(fondo_quadretti.gif) repeat-y;
border: 1px solid black;
}
#intro {
width:720px;
position:relative;
margin: 0px 20px auto auto;
border: 1px solid black;
}
#pageHeader {
width:430px;
height:234px;
margin-left:6px;
background:transparent url(pageHeader.jpg) no-repeat;
z-index:1;
}
#quickSummary {
position:absolute;
top:0px;
margin-left:436px;
width:269px;
height:234px;
background:transparent url(quick_summary.gif) no-repeat;
z-index:2;
border: 1px solid green;
}
#preamble {
width:636px;
margin-left:35px;
background:transparent url(extradiv2.gif) no-repeat;
border: 1px solid red;
}
Cosa succede? In explorer quando imposto il margin-left del div #preamble, si sposta anche il div #quickSummary che con il primo non ha nessuna relazione...
Ma in mozzilla invece questo non succede!??!!
Forse è un problema di compatibilità tra css e browser, ma è da un'ora che provo a fare tentativi e non riesco a concludere il passaggio.
Avete qualche soluzione?
Grazie! :master: