Jump to content

Change the color text for the <option>


houssam_ballout
 Share

Recommended Posts

As far as I know, CSS should work just fine. All you're going to need to do is change the color CSS property. Something simple like this works for me.

option.red {color: #FF0000;}... later in the actual HTML ...<select><option class="red" value="whatever">Some Red Option Text</option></select>

The only gotcha that you might encounter is that in FF, the actual select element itself won't change its color depending on the color of whatever option element is chosen. For IE and Opera (haven't got Safari or Chrome on my machine right now, can't test them), the text of the parent select element does change its color corresponding to the select element that gets highlighted. In FF, it appears as black or whatever default text color has been set by CSS. You can change the CSS of the select element to always default to a certain color, or if you want to ensure that FF and possibly other browsers choose the same color as the option element, a quick bit of JavaScript would help you out.

Link to comment
Share on other sites

  • 4 weeks later...

But that's just a minor styling issue, if you're really adamant on styling the form element yourself, you could build your own select :)However you shouldn't go that far, as custom selectboxes probably have better lightweight sollutions instead.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...