Obtention d'une disposition uniforme dans IE7 et IE8 avec les éléments de formulaire

Question

Il semblerait que IE7 place un espacement supplémentaire de 1px au-dessus et au-dessous des éléments de formulaire. IE8, FF3.5, Chrome 2 & Opera 9.5 restitue correctement ces éléments sans l'espacement. Ce que je veux cependant, c'est que l'affichage soit le même dans IE7, donc y a-t-il une solution pour que IE7 affiche correctement les éléments? Il ne semble pas important de savoir si l'élément de formulaire (par exemple, les zones de saisie) est placé à l'intérieur de s ou de s, et il ne semble pas avoir d'importance pour le remplissage, les marges & paramètres d'espacement. (les mettre tous à zéro a toujours un espace de 1px autour des boîtes de saisie)

Answer 1

Je me suis heurté à cela il y a quelque temps et pour être honnête, je ne suis pas totalement sûr de me souvenir de la correction. Il me semble me rappeler que cela a quelque chose à voir avec l'ajout de rembourrage à l'intérieur et à l'extérieur de la boîte d'entrée, ce qui rend impossible la réparation. C'était soit ça, soit les frontières. Essayez l'un de ceux-ci, ensemble et séparément:

input { 
    border: 0; 
    font-size: .9em; 
} 

Si l'un de ces offrent ce que vous avez besoin, je partirais avec un commentaire conditionnel comme:

<!--[if lte IE 7]> 
input { 
    border: 0; 
    font-size: .9em; 
} 
<![endif]--> 

Answer 2

Malheureusement, les navigateurs rendent les éléments de formulaire avec incompatibles hauteurs et largeurs. Heureusement, vos deux enfants problématiques sont IE6 et IE7, qui sont faciles à cibler en utilisant des commentaires conditionnels. Sans les voir, il est difficile de dire quelle serait la solution exacte, mais cela pourrait ressembler à ceci:

<!--[if lte IE 7]> 
    <style type="text/css"> 
      input{ padding-top: 3px;) /* 1px less than other browsers */ 
    </style> 
<![endif]-->