<select>-Tag mit unterschiedlichfarbigen Einträgen...

[Heinrich Krebs]

Hallo,

ich möchte einzelne Optionen in einem Select-Tag farblich hervorheben. Ich habe innerhalb der Option Tags versucht entsprechend die Farbe zu ändern:
....
<option value="2009-09-12">12.09.2009</option>
<option value="2009-09-13"><font style="color:#FF0000;">13.09.2009 - Wochenspiel (steigerungsrelevant)</font></option>
<option value="2009-09-14">14.09.2009</option>
...

Doch es hat keine Änderung ergeben. Auch mit einem <div> statt dem <font> trat keine Änderung auf. Ich habe auch mal das Schlagwort "blue" statt der Farbdefinition getestet, ohne sichtliche Änderung.
Als Betrachter diente immer Firefox 3.5

Die Definition für das Select in der separatern CSS-Datei lauten:
{
BORDER-RIGHT: #7f7f7f 1px solid;
BORDER-TOP: #7f7f7f 1px solid;
BORDER-LEFT: #7f7f7f 1px solid;
BORDER-BOTTOM: #7f7f7f 1px solid;
font-size: 9px;
WIDTH: 200px;
}
wobei ich über ein style-Agrument die Breite in der Datei auf 250px hoch setze.

Weiß jemand ob eine entsprechende Färbung bei einzelnen Einträgen möglich ist und wie ich sie bewerkstelligen kann ?

Vielen Dank im Voraus

[EKKi]

Mahlzeit Heinrich Krebs,

<option value="2009-09-13"><font style="color:#FF0000;">13.09.2009 - Wochenspiel (steigerungsrelevant)</font></option>

Doch es hat keine Änderung ergeben.

Das ist nicht verwunderlich, <http://de.selfhtml.org/html/referenz/elemente.htm#option@title=da <option> nichts als #PCDATA enthalten darf>.

Versuche doch stattdessen mal, der gewünschten <option> eine eigene Klasse zu verpassen und diese mittels CSS entsprechend zu formatieren.

Auch mit einem <div> statt dem <font> trat keine Änderung auf.

Auch das ist nicht nicht verwunderlich ...

MfG,
EKKi

[Heinrich Krebs]

Danke, der Hinweis und der Tipp haben mir sehr geholfen.

Versuche doch stattdessen mal, der gewünschten <option> eine eigene Klasse zu verpassen und diese mittels CSS entsprechend zu formatieren.

[Gunnar Bittersmann]

@@EKKi:

nuqneH

<option value="2009-09-13"><font style="color:#FF0000;">13.09.2009 - Wochenspiel (steigerungsrelevant)</font></option>

Wennschon Inline-Style, dann doch gleich fürs 'option'-Element:
<option value="2009-09-13" style="color:#FF0000;">13.09.2009 - Wochenspiel (steigerungsrelevant)</option>

Aber Inline-Styles sind pfui!

Versuche doch stattdessen mal, der gewünschten <option> eine eigene Klasse zu verpassen

Nein, wozu?

Es geht ganz ohne Klasse – mit Attributselektor [CSS2 §5.8]:

option[value="2009-09-13"]  
{  
  color: #FF0000;  
}

Falls IE 6 noch unterstützt werden soll: mit CSS-Expression

* html option  
{  
  color: expression( [code lang=javascript](new Function('elem', '[code lang=javascript]elem.style.color = (elem.value && (elem.value == "bar") ? "#FF0000 " : "");
~~~'))(this)[/code] );  
}[/code]  
  
Qapla'

-- 
Alle Menschen sind klug. Die einen vorher, die anderen nachher. (John Steinbeck)

[Gunnar Bittersmann]

@@Gunnar Bittersmann:

nuqneH

color: expression( (new Function('elem', '[code lang=javascript]elem.style.color = (elem.value && (elem.value == "bar") ? "#FF0000 " : "");'))(this)[/code] );
}[/code]

Grmpf, statt "bar" natürlich "2009-09-13".

Qapla'