Balise input, aligner le texte en hauteur Résolu

Question

Bonjour, j'ai un soucis qui demeure sans solution, j'ai créer une image pour mes input text de mon formulaire et comme il y a de l'ombre en dessous, le texte ne s'aligne plus au centre vertical de celui ci.

Il y aurais t'il un moyen faire remonter le texte à la hauteur que je veut dans mon input, j'ai beau chercher, je ne trouve pas. 

Merci à vous par avance.



Configuration: Windows 7 / Firefox 3.6.8

kalidou · Answer

envoie le code pour voir

Blunty · Answer

.input {
	width: 242px;
	height: 35px;
	line-height: 10px;
	font-size: 10pt;
	color: #5a5a5b;
	background-color: transparent;
	vertical-align: middle;
	background-image: url("../images/input.png");
	background-repeat: no-repeat;
	background-position: left top;
	padding-left: 10px;
	padding-top: -10px;
	outline: none;
	border: none;
}

.input:hover {
	width: 242px;
	height: 35px;
	line-height: 18px;
	font-size: 10pt;
	color: #5a5a5b;
	background-color: transparent;
	vertical-align: middle;
	background-image: url("../images/input-hover.png");
	background-repeat: no-repeat;
	background-position: left top;
	outline: none;
	border: none;
}

.input:focus /* Quand le curseur est sur un champ */
{
	width: 242px;
	height: 35px;
	line-height: 10px;
	font-size: 10pt;
	color: #000000;
	background-color: transparent;
	vertical-align: middle;
	background-image: url("../images/input-focus.png");
	background-repeat: no-repeat;
	background-position: left top;
	outline: none;
	border: none;
}

et je t'envoie l'image pour que tu vois le resultat

[URL=https://imageshack.com/][IMG]http://img820.imageshack.us/img820/2345/input.png[/IMG][/URL]

Uploaded with [URL=https://imageshack.com/]ImageShack.us[/URL]

Merci

Blunty · Answer

J'ai trouver une solution, séparer l'ombre de mon image et créer une classe en dessous de chaque input ce qui a recaler le texte au centre de l'input.

Merci à vous

Balise input, aligner le texte en hauteur

3 réponses

Discussions similaires

Newsletters