Aligner deux images avec un formulaire

eg33 Messages postés 1303 Statut Membre -  
avion-f16 Messages postés 20368 Date d'inscription   Statut Contributeur Dernière intervention   -
Bonjour,

C'est peut-être moi qui suis débile ou qui ignore un truc important, mais bon, je débute...

J'aimerais que les deux flèches se trouvent aux deux extrémités du formulaire ; mais quand je fais comme ça :

<p style="text-align:center"> 
<img style="float: left; margin-right: 5px" src="http://cdn.iconfinder.net/data/icons/silk2/resultset_next.png" /> 
<form> 
<select name="ListeUrl" size=1 onChange="ChangeUrl(this.form)"> 
<option selected value="" style="text-align:center; color:grey">Choisissez votre format... 
[...]
</select> 
</form> 
<img style="float: right; margin-left: 5px" src="http://cdn.iconfinder.net/data/icons/silk2/resultset_previous.png" /> 
</p>


Ça ne fonctionne évidemment pas. Normal, vous allez me dire, mais je dois avouer que j'ai essayé plusieurs combinaisons, et impossible de trouve la bonne. Alors je fais appel à vous !

Quelqu'un de dévoué pourrait-il me corriger SVP ? Merci beaucoup.
On croyait avoir atteint le pire avec HADOPI... LOPPSI, ça c'est le pire !
WOT : un système simple et gratuit d'évaluations partagées de sites, pour un Web plus sûr.

2 réponses

avion-f16 Messages postés 20368 Date d'inscription   Statut Contributeur Dernière intervention   4 510
 
Salut.
Ton lien est invalide.
0
eg33 Messages postés 1303 Statut Membre 66
 
Désolé ; j'ai collé le code ici, ça sera plus simple finalement.
0
avion-f16 Messages postés 20368 Date d'inscription   Statut Contributeur Dernière intervention   4 510
 
Voilà :
<form>
	<div>
		<img style="margin-right: 5px; vertical-align: middle;" src="http://cdn.iconfinder.net/data/icons/silk2/resultset_next.png" />
		<select style="vertical-align: middle;" name="ListeUrl" size="1" onchange="ChangeUrl(this.form)">
			<option selected value="" style="text-align:center; color:grey">Choisissez votre format...</option>
		</select>
		<img style="margin-left: 5px; vertical-align: middle;" src="http://cdn.iconfinder.net/data/icons/silk2/resultset_previous.png" />
	</div>
</form>


Inutile d'utiliser float, <img /> et <select> sont des éléments en lignes (inline).
J'ai ajouter "vertical-align: middle" pour que ce soit bien aligné.
0
eg33 Messages postés 1303 Statut Membre 66
 
Merci infiniment pour ton aide, je prend note de ce rappel important. Juste par curiosité : pourquoi une balise DIV ?

Par ailleurs, je viens de me rendre compte que le vertical-align: middle n'a aucun effet (top & bottom, oui) ; pourtant cette valeur existe (testé sous plusieurs navigateurs)...
0
avion-f16 Messages postés 20368 Date d'inscription   Statut Contributeur Dernière intervention   4 510
 
Le div c'est par habitude : je mets chaque ligne de mes formulaires dans son div.
0