How do you change the font-size for JUST the selected option of select (dropdown) menus (that shows when the dropdown menu is closed), without effecting the other option items that appear when the dropdown menu is opened? Specifically, for desktop Chrome.
Here's what I'm trying to achieve:
See how the font sizes are different?
Here's what I've tried:
HTML:
<select>
<optgroup style="font-size: 8px !important;">
<option value="option1">Option #1</option>
<option value="option2">Option #2</option>
<option value="option3">Option #3</option>
</optgroup>
</select>
CSS:
select {
-webkit-appearance: none;
font-size: 50px;
}
select option {
font-size: 8px;
}
