ciao,
ho 5 div box allineati: 2 sopra e 3 sotto.
Separo i 2 superiori dai 3 inferiori con una linea <hr /> dopo aver dato un clear:both tra il primo e il secondo blocco div.
come da immagine sotto, con IE7 e 9 non viene rispettato il margine superiore. cioè il margine superiore è maggiore a quello inferiore come dovrebbe essere e come si vede, giustamente, con FF e Chrome.
CSS:
.box {
text-align:left;
width: 226px;
Height:160px;
float: left;
position:relative;
background: #fef6df;
border:1px solid #fdcb0a;
}
.box1 {
text-align:left;
width: 346px;
height:160px;
float: left;
position:relative;
background: #fef6df;
border:1px solid #fdcb0a;
}
hr {color:red; background-color:red; border:0px solid red; height:1px;}
.clear {clear:both}
e l'HTLM:
<div class="box1">Testo1</div>
<div class="box1">Testo2</div>
<div class="clear"></div>
<hr />
div class="box">Testo1</div>
div class="box">Testo2</div>
div class="box">Testo3</div>
ho utilizzato il clear:both perchè altrimenti non viene visualizzata la linea <hr />
Altrimenti mi bastava aggiungere un margin-bottom al box1
soluzioni?
grazie!


Rispondi quotando