Afficher 2 elts/option dans un tag <option>
neuf
Messages postés
4
Statut
Membre
-
Dalida Messages postés 7114 Statut Contributeur -
Dalida Messages postés 7114 Statut Contributeur -
Salut,
je suis entrain de mettre en place une liste de selection de pays dans laquelle l' utilisateur pourra faire le choix d'un pays.je voudrais faire afficher dans cette liste le drapeau suivi du nom du pays grace au tag <OPTION>.
<select name="select_pays" id="select_pays">
<option value="benin"><img src="image/drapeau/20px-Flag_of_Benin.svg.png" /> Bénin</option>
<option value="burkina faco"><img src="image/drapeau/20px-Flag_of_Burkina_Faso.svg.png" /> Burkina faco</option>
</select>
Mais malheureusement c'est seulement le nom du pays qui s'affiche et nom le drapeau suivit du nom.
Quelqu'un aurait une solution pour moi?
Merci
je suis entrain de mettre en place une liste de selection de pays dans laquelle l' utilisateur pourra faire le choix d'un pays.je voudrais faire afficher dans cette liste le drapeau suivi du nom du pays grace au tag <OPTION>.
<select name="select_pays" id="select_pays">
<option value="benin"><img src="image/drapeau/20px-Flag_of_Benin.svg.png" /> Bénin</option>
<option value="burkina faco"><img src="image/drapeau/20px-Flag_of_Burkina_Faso.svg.png" /> Burkina faco</option>
</select>
Mais malheureusement c'est seulement le nom du pays qui s'affiche et nom le drapeau suivit du nom.
Quelqu'un aurait une solution pour moi?
Merci
A voir également:
- Afficher 2 elts/option dans un tag <option>
- Supercopier 2 - Télécharger - Gestion de fichiers
- Windows 11 afficher d'autres options - Guide
- Paris multiple 2/6 explication ✓ - Forum Loisirs / Divertissements
- Afficher le 0 devant un nombre dans excel - Guide
- 2 ecran pc - Guide
1 réponse
Bonjour,
Ce n'est pas un problème de nombre d'éléments dans le <option>, c'est le fait qu'un option n'accepte pas de code html. L'image est donc ignorée.
Par contre, il y a moyen de contourner le problème en utilisant des styles :
Voilà !
Xavier
PS : je n'ai pas testé ceci sur d'autres navigateurs que Firefox...
Ce n'est pas un problème de nombre d'éléments dans le <option>, c'est le fait qu'un option n'accepte pas de code html. L'image est donc ignorée.
Par contre, il y a moyen de contourner le problème en utilisant des styles :
<select>
<option value="1" style="background:url('image/drapeau/20px-Flag_of_Benin.svg.png') no-repeat; background-position:0 4px; padding-left:15px;">Bénin</option>
<option value="2" style="background:url('image/drapeau/20px-Flag_of_Burkina_Faso.svg.png') no-repeat; background-position:0 4px; padding-left:15px;">Burkina Faso</option>
</select>Les valeurs que j'ai données pour padding-left et background-position peuvent être changées pour améliorer l'affichage. J'éi testé avec de toutes petites images, donc j'ai dû abaisser l'image de 4px pour qu'elle soit centrée.
Voilà !
Xavier
PS : je n'ai pas testé ceci sur d'autres navigateurs que Firefox...
spécification HTML 4.01
le type CDATA représente une séquence de caractères, issus du jeu de caractère du document, qui peut inclure des entités de caractères.