[Résolu] Style dans une liste déroulante

Bonjour,

je voudrais simplement mettre un style pour chaque <option> de mon <select>, je ne pensais pas avoir de problème là dessus.

Le code ci dessous fonctionne uniquement avec Firefox, et pas avec IE ou Opera :

CSS :

option.fam1 {
		padding-left:5px;
		font-weight:bold;
	}
	option.fam2 {
		padding-left:20px;
	}
	option.fam3 {
		padding-left:40px;
	}

HTML :

<select id="select_fam">
	<option value="8" class="fam1">option8</option>
	<option value="53" class="fam2">option53</option>
	<option value="54" class="fam2">opt54</option>
	<option value="55" class="fam2">opt55</option>
	<option value="56" class="fam2">opt56</option>
	<option value="7" class="fam1">opt7</option>
	<option value="47" class="fam2">opt47</option>
	<option value="48" class="fam2">opt48</option>
	<option value="85" class="fam3">opt85</option>
	<option value="86" class="fam3">opt86</option>
	<option value="87" class="fam3">opt87</option>
</select>

Sous firefox le premier niveau est bien en gras, et les autres sont bien indentés. Qu'est ce que j'ai oublié pour que ça marche aussi sous IE et Opera ?

Merci

Edit : j'ai vérifié, ma page est bien valide W3C
Modifié par vichenze (19 Jan 2009 - 14:04)

Salut,

un peu de lecture : Comment ne pas styler les éléments de formulaire ?

Bonjour,

c'est un des éléments les plus flexibles, surtout vu que le W3C n'impose rien. Cf. Safari 2 sur Mac qui ne permet rien
Un lien intéressant: http://www.456bereastreet.com/lab/form_controls/select/

EDIT: genre
Modifié par Felipe (19 Jan 2009 - 12:26)

Merci pour les liens.

Comment je peux faire alors, parce que là tout au même niveau c'est illisible. Y'a bien <optgroup>, mais ce n'est pas sélectionnable, or il faut que les niveaux 1 ou 2 puissent être sélectionné, et pas simplement le niveau 3.

vichenze a écrit :
Comment je peux faire alors, parce que là tout au même niveau c'est illisible. Y'a bien <optgroup>, mais ce n'est pas sélectionnable, or il faut que les niveaux 1 ou 2 puissent être sélectionné, et pas simplement le niveau 3.

Tu peux éventuellement tricher en plaçant des &nbsp; ou des tirets ou début de chaque intitulé pour indiquer le niveau.

Item 1
— Item 1.1 
— Item 1.2
Item 2
— Item 2.1
— Item 2.2
—— Item 2.2.1

Pas terriblement accessible, mais ça peut dépasser.
Bon, il faut voir en fonction du contenu...
Modifié par Florent V. (19 Jan 2009 - 12:42)

Ok, je vais faire ça