Centrer verticalement le texte d'un input submit

Bonjour,

J'essaye (désespérement) de centrer verticalement mon texte dans une input de type submit. Celui est systématiquement aligner avec le bas du bouton

Donc le code html

<input type="submit" class="submitButton" value="Valider" />

et le CSS associé

form {margin: 0px; padding: 0px; }
input.submitButton { 
	background: #616161;
	border: 1px solid #616161;
	color: #fff;
	vertical-align: middle;
	height: 22px;
}

J'ai essayé en change la directive display (en inline ou inline-block) cela ne change strictement rien !

En supprime le height et en jouant avec le padding cela fonctionne ... mais cela est interpréter différemment en fonction des navigateurs et pour l'aspect visuel, mon bouton doit faire 22px de haut !

Je suis en XHTML 1.0 Transitional

Merci pour votre aide

Bonjour,

as-tu testé un line-height:22px ?

Sinon réfères-toi également à cet article et à certains autres..

Bon courage !

Bonjour aussi,

a écrit :
En supprime le height et en jouant avec le padding cela fonctionne

Pourquoi supprimer le "height" ? laisse le height a 22px et met un padding-bottom de quelques pixels. Pour moi ca fonctionne sous FF8 et IE8 (je sais pas si ca bloque sur plus récent..)

Merci pour vos réponses

Donc j'ai laissé le height à 22px. En fait, je me suis aperçu que sur l'ensemble des navigateurs hormis FF, le texte est centré verticalement.

Il n'y a qu'avec Firefox 8.0 (tant sous Win que Linux) que mon texte est en bas du bouton !

Mais si j'augmente le height à 30 ou 40 pixels, peut importe ... le texte avec FF 8 est centré verticalement. C'est un peu comme si mon bouton n'est pas assez haut !!!

Si j'ajoute du padding-bottom, sur FF le texte se centre ... les autres navigateurs restent insensible à la modif, sauf Opera pour qui du coup le texte est trop vers le haut !