Dropdown Menu Help!

[Jick]

Is it possible to make the colors of the text in a dropdown menu different colors for example. A drop down menu with three options (Red, Blue Green) and each of those options has the text of it that color! Help please?

[AdamGundry]

The select element (dropdown list), as I understand it, does not have any way of controlling individual list elements. You can control the overall appearance using CSS, but not each line on its own.

I'm not totally certain, of course - anyone else got any ideas?

Adam

[cyberade]

<form>
<select name="Colours">
<option value="Red" style="color='red'">Red</option>
<option value="Blue" style="color='blue'">Blue</option>
<option value="Green" selected="selected" style="color='green'">Green</option>
<option value="Orange" style="color='orange'">Orange</option>
</select>
</form>

[Nevermore]

That should be:


<form>
<select name="Colours">
<option value="Red" style="color:red">Red</option>
<option value="Blue" style="color:blue">Blue</option>
<option value="Green" selected="selected" style="color:green">Green</option>
<option value="Orange" style="color:orange">Orange</option>
</select>
</form>

[cyberade]

Ah, well done! You spotted my deliberate mistake!;)

Thanks for the update Cijori.

[Jick]

Thank you guys thats exactaly what I wanted. I works great now. Thanks. :D

[Jick]

I have another drop down menu on the same page that you can select font face. I wundered if you could use the same operation as the color thing you guys showed me to make it so each font selection in the drop down menu is displayed with its font so like when the user views the drop down menu they will be able to see what the font looks like before they use it. Can anybody help? Thanks. :D

Would it be like this?

<form>
<select name="Font">
<option value="Arial" style="font:arial">Arial</option>
<option value="Verdana" style="font:verdana">Verdana</option>
<option value="Courier" style="font:courier">Courier</option>
<option value="Comic" style="font:comic">Comic</option>
</select>
</form>

Please help! Thanks. :D

[cyberade]

Instead of just 'font' use 'font-family'.

Take a look at http://www.w3schools.com/html/html_fonts.asp for some hints on how to use fonts with style! (Did I just say that?:o )

[Jick]

I gave this a try but it didn't work?

<form>
<select name="Font">
<option value="Arial" style="font-family:arial">Arial</option>
<option value="Verdana" style="font-family:verdana">Verdana</option>
<option value="Courier" style="font-family:courier">Courier</option>
<option value="Comic" style="font-family:comic">Comic</option>
</select>
</form>

Help please advise? :D

[Nevermore]

I don't think you can change anything about the options except for the colour.

[Jick]

:D Does anybody else have any suggestions?

[Jick]

Is there a way to do this without flash or any thing. Can it be done with html or javascript? Thanks. :D

[DrDaMour]

if font-family doesn't work, then it's not implemented yet, wait for IE8