Styling for option values in a HTML select drop-down doesn't work in Chrome & Safari

color style works fine in <option> elements on Windows 7 with current versions of Chrome, Safari, Firefox, IE, and Opera, as well as on Mac with Firefox; but appears to be a no-op on Mac with Chrome and Safari. Seems like a bug to me.


The short answer - you can not do that in Webkit based browsers. I.e. about padding take a look here

To overcome your problem you can change your <select> to a list <ul> and style its' <li> items. That will work in every browser guaranteed.


Please try to use this

select {
      -webkit-appearance: none;
      -moz-appearance: none;
      appearance: none;
}