As an OSX user, I primarily use Chrome and recently discovered that styling the HTML option element is not applied in any browser (Chrome, Firefox, Safari) on OSX.
// HTML
<select>
<option class="option">Value 1</option>
<option class="option">Value 2</option>
<option class="option">Value 3</option>
</select>
// CSS
select {
background-color: #fff;
color: transparent;
}
.option {
color: black; /* This is not applied in OSX */
}
View codepen for demonstration: https://codepen.io/Dongbin/pen/PoejmeM
I then tested the same code in different browsers on a Windows system, where it worked as expected.
Curious to understand why this discrepancy exists between OSX and Windows for styling HTML options.