[Résolu] Alignement input & image

Bonjour à tous,

Pour mon premier post je viens vous demander de l'aide car... Imaginons ceci ;

<input type="text"><img src="ajaxwait.gif">

Ce qui va donner en image ;

http://www.pixenli.com/images/1189946536068401700.png

En gros, l'image est elle même bien faite, bien cadrée, mais elle se déplace vers le haut par je ne sais quelle magie...

Ma question est donc evidente, comment aligner celle-ci avec le champ input ? Tableau obligatoire ?

Merci
Modifié par Aurelgadjo (17 Sep 2007 - 16:27)

Bonjour,

Il faudra utiliser la propriété CSS vertical-align (par exemple: vertical-align: middle), à appliquer à l'élément à aligner verticalement par rapport à la ligne de texte.

Merci beaucoup, je teste ça

Edit ;
Je n'arrive pas à l'appliquer. Si je met un div style... autour de l'image, celle-ci passe à la ligne.
Detestant le css, je ne vois pas trop quoi tenter d'autre... Any idea ?
Modifié par Aurelgadjo (16 Sep 2007 - 16:01)

Aurelgadjo a écrit :
Si je met un div style... autour de l'image, celle-ci passe à la ligne.

Forcément, si tu rajoutes un élément de type bloc autour de l'image, l'élément de type bloc passe à la ligne, et l'image avec. Même pas besoin de CSS pour obtenir ça...

Pourquoi pas tout simplement:

<input type="text"><img src="ajaxwait.gif" style="vertical-align: middle,">

?

Ou, plus évolué:

[b]HTML:[/b]
<p id="blabla">
	<input type="text">
	<img src="ajaxwait.gif" alt="">
</p>

[b]CSS:[/b]
#blabla img {vertical-align: middle;}

Attention à utiliser un texte alternatif pertinent pour l'image.

Edit: sujet déplacé dans le salon ad hoc.
Modifié par Florent V. (16 Sep 2007 - 18:37)

Florent V. a écrit :
Pourquoi pas tout simplement:

<input type="text"><img src="ajaxwait.gif" style="vertical-align: middle,">

?

Je ne pensais pas que c'était possible, merci du tip.
A noter que tu as mis une virgule et il semble que le point virgule fonctionne mieux.

Florent V. a écrit :
Edit: sujet déplacé dans le salon ad hoc.

Merci m'sieur le modo.

Bon bah sujet résolu, encore merci, ça semble marcher comme il faut
(J'ai mis bottom au lieu de middle perso)
Modifié par Aurelgadjo (17 Sep 2007 - 16:26)