J'ai l'élément d'entrée suivant (j'ai délibérément omis les attributs qui n'étaient pas nécessaires pour l'exemple) :
<input type="text" style="display: block; height: 40px; font-size: 14px; line-height: 40px"/>
Dans Chrome et Internet Explorer (probablement aussi dans Opera), tout texte à l'intérieur de la saisie sera centré verticalement. Cependant, Firefox semble ignorer cette déclaration. En lui donnant la valeur display: inline-block;
à la place, ou en utilisant vertical-align: middle;
n'a aucun effet dans Firefox.
J'ai également essayé de régler les marges supérieure et inférieure sur 13px
et la hauteur à 14px
ce qui (combiné à la taille de la police) donnera lieu à un élément 40px
grand. Cela fonctionne comme prévu, sauf pour les caractères avec des queues (comme g , q , j etc.) sont coupés en bas.
Je suis à la recherche d'une solution multi-navigateurs pour aligner verticalement le texte d'une zone de saisie dont la hauteur est fixe. L'élément de saisie aura ses propres styles de survol et de mise au point, de sorte qu'il faut simuler le centrage en positionnant l'élément lui-même verticalement dans une zone de texte. 40px
le grand espace n'est pas vraiment une option.
Cheers