PDA

View Full Version : semplicissimo div... mozilla lo vede bene...explorer...??

TorpedoBlu
23-01-2007, 18:47
<body>
<div style="background-image:url(body_top.jpg); width:763px; height:16px; background-repeat:no-repeat;">
</div>
<div style="background-image:url(body_central.jpg); width:763px; height:auto; min-height:300px; background-repeat:repeat-y;">
ciao<br />
ciao<br />
ciao<br />
ciao<br />
ciao<br />
</div>
<div style="background-image:url(body_down.jpg); width:763px; height:16px; background-repeat:no-repeat">
</div>
</body>



semplice no?? ho 3 jpg che richiamo nei 3 div... ma tra il primo e l'ultimo explorer mi mette una schifosa riga bianca, perchè? mozilla no.
TorpedoBlu
23-01-2007, 21:31
http://torpedoblu.altervista.org/index2.html

ecco l'esempio
andbin
23-01-2007, 23:05
ma tra il primo e l'ultimo explorer mi mette una schifosa riga bianca, perchè?Famoso e noto baco di IE denominato "IE three pixel gap".

Lo risolvi mettendo font-size:1px; per .top
TorpedoBlu
23-01-2007, 23:31
Famoso e noto baco di IE denominato "IE three pixel gap".

Lo risolvi mettendo font-size:1px; per .top

ah praticamente dovevo mettere una grandezza per i font?

una cosa, nei css c'è un ottimo parametro che è min-height che dice che il mio riquadro si adatta al testo in altezza, ma cmq mantiente un minimo, explorer chiaramente non lo supporta, e per explorer devo mettere una grandezza fissa e poi overflow su visible (non voglio scrollare il contenuto ma che il riquadro si adatti)... ma mozilla poi non è d'accordo quindi:

metto un css per mozilla e uno per explorer? (come si fa?) oppure c'è una solizione?
TorpedoBlu
24-01-2007, 00:45
va bene anche un consiglio
andbin
24-01-2007, 10:10
ah praticamente dovevo mettere una grandezza per i font?Sì.
Devo però ammettere che mi sbagliavo sul bug. Non è il "three pixel gap" (che avviene quando ci sono di mezzo i float) :doh: ma un altro problema di IE legato al fatto che il div è troppo piccolo come altezza e sebbene nel div non ci sia nulla (è aperto e poi subito chiuso), lui allunga il div almeno quanto la dimensione del font. IE ha talmente tanti bachi che ... ci si può pure confondere. :D

(non voglio scrollare il contenuto ma che il riquadro si adatti)Spero di aver capito bene: tu vorresti che il div "body" fosse alto come minimo un tot (300px) ma che possa eventualmente aumentare in altezza a seconda di cosa ci scrivi dentro??
Se è così, lo risolvi in questo modo:

<div class="top"></div>
<div class="body">
<div class="body_min"></div>
ciao<br />
ciao<br />
ciao<br />
ciao<br />
ciao<br />
<div class="body_cl"></div>
</div>
<div class="down"></div>

.top {
background: url("body_top.jpg") no-repeat;
width:763px;
height:16px;
font-size: 1px;
}

.body {
background: url("body_central.jpg") repeat-y;
width:763px;
}

.body_min {
float: left;
height: 300px;
}

.body_cl {
clear: both;
}

.down {
background: url("body_down.jpg") no-repeat;
width:763px;
height:16px;
font-size: 1px;
}