CSS Formatierungen zwischen <option></option>

[HoverSK]

Hallo zusammen,

ich möchte gern innerhalb eines Eintrags einer Dropdownliste verschiedene Formatierungen haben. also Quelltextmässig etwa so:

<select size=1>
<option>Text <span class="italic_grey">- Description</span></option>
<option>Text2 <span class="italic_grey">- Description2</span></option>
<option>Text3 <span class="italic_grey">- Description3</span></option>
</select>

Das Ziel ist es "Text" anders darzustellen als "Description" und das alles in einer Zeile.

Ich weiß des es kein Problem ist den Style der ganzen Zeile mit CSS zu formatieren.
Warum geht das dann nicht auch innerhalb der Zeile?
mache ich etwas falsch oder ist es einfach so (und wenn ja warum?)

MfG
HoverSK

 

[Nogger]

Ich weiß des es kein Problem ist den Style der ganzen Zeile mit CSS zu formatieren.

Geht so. Die Browserunterstützung für das Stylen von Option-Elementen variiert erheblich.

Warum geht das dann nicht auch innerhalb der Zeile?

Innerhalb von <option> ist nur reiner Text erlaubt, keine weiteren Tags.

 

[HoverSK]

Geht so. Die Browserunterstützung für das Stylen von Option-Elementen variiert erheblich.

Die Browser Unterstützung is mir total egal. Es muss nur mit Firefox laufen. (Ist nur Firmenintern und ich kenne keinen Entwickler der den IE benutzt.)

Innerhalb von <option> ist nur reiner Text erlaubt, keine weiteren Tags.

Naja, aber es ist ja möglich ein gesamtes Option Element mit CSS zu verändern.
Gibt es denn keinen Weg das irgendwie auch mit nur einem Teil davon zu machen?

MfG
HoverSK

 

[Nogger]

Naje aber es ist ja möglich ein Gesamten option Element mit CSS zu verändern

Ja, weil es einen CSS-Selektor gibt, der ein Option-Element selektieren kann, um dessen Darstellung zu ändern.

gibt es denn keinen weg das irgendwie auch mit nur einem Teil davon zu machen?

Nein, weil es keinen CSS-Selektor gibt, der einen Teil des Textes in einem Option-Element selektieren kann, um dessen Darstellung zu ändern.

Aus diesem Grund werden regelmäßig bei solchen Anforderungen Select-Elemente mittels Javascript emuliert. Ich kann da aber nur auf Google verweisen, meine Lösung dafür ist nicht frei.

P.S.: Deine Texte werden einfacher lesbar, wenn du an strategisch günstigen Stellen auch Komma und Punkte setzt. Danke.