Salve a tutti,
in questa pagina http://www.chionitendaggi.altervista.org/rarita.htm , l'immagine (classe .cella-immagine) all' interno della cornice (classe .cornice) non risulta centrata verticalmente con IE 6.0 e ancor peggio con Opera 7.11, mentre con Mozilla 1.4 non ci sono problemi.
Dove sbaglio?
Riporto una parte del css
http://www.chionitendaggi.altervista...ss/schermo.css relativa alla
pagina in questione:
.cella {
width: 80%;
margin-bottom: 10px;
}
.cornice {
margin-right: 10px;
margin-bottom: 10px;
padding: 0px;
width: 132px;
height: 110px;
background-color: #779998;
border: 5px ridge #778899;
float: left;
}
.cella-immagine {
position:relative;
top: 50%;
left: 50%;
width: 100px;
height: 75px;
margin: -47.5px 0px 0px -60px;
padding: 7px;
background-color: Aqua;
border: 3px ridge #778899;
}
.cella h4 {
margin: 0px;
padding: 0px;
}
.cella p {
margin: 0px;
padding: 0px;
}
.no-float {
clear: left;
}
Mentre la struttura XHTML è:
<div class="cella">
<div class="cornice">
<div class="cella-immagine"> [img]immagini/valigia-small.jpg[/img]
</div>
</div>
<h4>La valigia antica</h4>
custodisce gli antichi ricami di mani sapienti.</p>
</div>
Ho voluto fare una prova http://chionitendaggi.altervista.org/prova.htm
eliminando bordi e spaziature e ho notato che, con IE6.0, il colore di sfondo sporge qualche pixel nella parte inferiore delle immagini, mentre con Opera non accade. Con Mozilla compare un leggero bordino inferiore nella prima e ultima immagine.
Che ne pensate?
Grazie anticipatamente
Franco