[CSS] Padding in IE e Mozzilla

[PaoDJ]

Ciao a tutti,

sto scrivendo un css e mi trovo in questa situazione: ho un layer di 170px x 27px con, in un immagine in background, un ovale colorato.

Per allineare il testo centrato verticalmente nel box, ho pensato di usare il padding-top ma, come al solito, ie visualizza il background correttamente, mozzila, invece, aggiunge ai 27px il valore del padding-top (che ho settato a 5px) settando l'altezza del layer a 32 px con la conseguente ripetizione del background.

Come posso risolvere questo problema?
Devo per forza usare background-repeate?

Pao

[Furcas]

Originariamente inviato da PaoDJ
Per allineare il testo centrato verticalmente nel box, ho pensato di usare il padding-top ma, come al solito, ie visualizza il background correttamente, mozzila, invece, aggiunge ai 27px il valore del padding-top (che ho settato a 5px) settando l'altezza del layer a 32 px con la conseguente ripetizione del background.

al contrario ... è IE che sbaglia, non Mozilla. il bug del box-model è uno dei più famosi di IE ...

[PaoDJ]

A quel punto il Bug c'è anche in Opera e Konqueror, xkè anke questi 2 browser seguono IE nel calcolo delle dimensioni dei box.

A parte questo, il problema non ha soluzione? Xkè anke se usassi un background-repeat, con mozzilla rimarebbe una fastidiosta riga di spazio vuota quando i layer sono settati come relative.


Domanda: quello che vedo con mozzilla, vale anche x Netscape, vero?

[PaoDJ]

Risolto, ecco come:

1. <?xml version="1.0" ?>
Eliminando questa riga dai codici xhtml, anche ie 6, opera e konqueror evitano di sbagliare nel box-model.

2. Per settare due diverse altezza (vale anche per le lunghezze) una per IE 5 ed una x gli altri, a fine definizione di stile si inserisce:

height: 22px; voice-family: "\"}\""; voice-family: inherit; height: 17px;

Dove 22px è l'altezza incluso padding, margin, ecc. (per ie 5) e 17px l'altezza seguendo gli standard
w3c.

Grazie a tutti cmq!