Styling a form Option tag

[Wickham]

If you have a series of options inside a select tag and you want to highlight one or two, you can use the selected="selected" code but this uses the browser default color (blue in IE).

 

If you want to style one or two with your own styles, w3schools says that inline styles or a class is possible http://www.w3schools.com/TAGS/tag_option.asp

 

However, I have found that a color does work, but not font-weight: bold; or font-style: italic in IE7.

• Select product:

• Component

  1

  Component

  2

  Component 3
  Component 4

 

Any ideas how to get just one or two options with a different style without styling the whole select tag?

 

Edit: I've found that Firefox shows all styles but IE7 only shows the color, not bold or italic.

 

I tried putting a p tag inside and styling that, but it didn't work.

Edited June 7, 2009 by Wickham

[PicnicTutorials]

Eddie had this delima a few weeks back. He ended up using jQuery I believe to style the "whole" select. I messed with it a few few weeks ago and was unable to style it any differently than default. All I was able to find at the time was selected="selected" that you found as well.