Formulaire sans tableau et hauteur de ligne sous IE

Bonjour,

Pour me perfectionner en CSS, je m'exerce sur des cas courants.
Là, je fais un formulaire sans tableau.
Le gros de la chose est ok mais j'ai un soucis sur la hauteur des "rangées" du formulaire.
J'ai pourtant mis à chaque ligne une hauteur de 14px ...
Sous IE les lignes sont plus hautes ...

Je n'arrive pas à cerner le problème !
J'aimerai tout bien calibrer.

La page de test : http://www.autonetone.com/test_css/formulaire_sans_tableau_css.html

Merci par avance du coup de pouce.
Bye
Seb

Bonjour,

Après le très connu " IE Doubled Float-Margin Bug", voici le "IE Doubled Float-Padding-top Bug" !

Lorsque le contenu de #foo est composé uniquement de 2 flottants, comme ici, IE multiple par deux la valeur du padding-top de #foo...

On peut le mettre en évidence avec un peu de couleur et un padding plus visible:

div.rangee {
clear: both;
padding-top: 30px;
margin:0px;
background-color: yellow;
}

Le bug disparaît si tu ne fais plus flotter le deuxième élément (ici div.rangee span.formw ), ou si tu n'appliques plus qu'un padding-bottom et pas de padding-top...

Sinon, une autre solution (brutale) serait d'indiquer une valeur de padding-top spéciale IE, à l'aide d'un hack :

div.rangee {
clear: both;
margin:0px;
background-color: yellow;
padding-top: 30px !important;  /* Valeur FF, Opera, etc. */
padding-top: 15px;                    /* Valeur pour IE */
}

(un html>body serait bien aussi. Ou carrément une CSS en commentaires conditionnels...)

L'amusant, c'est que ce bug ne me semble pas répertorié. On en découvre tout les jours

Bonjour,

Je vais gérer les 2 hauteurs suivant le navigateur ...

Merci pour votre aide !

Un petit [Resolu] dans le titre du sujet, alors ?