Setting font-size for dropdown in chrome does not seem to affect the styling

I set the font-size for the dropdown in chrome, but it does not appear to ch开发者_如何学JAVAange the size of the <select>

It works on FF - when i set the font-size as 15px, it is distinctively bigger

If Chrome and Safari just ignore your height, font-family and font-size CSS settings for select: Adding a border attribute could help Webkits to respect your settings.

Example:

select {
 border: 1px solid #a4a4a4; /*Same grey as default appearance*/
 ( background: transparent; /*Would work too, but adds an ugly black border*/ )
 font-family: times; /*Now in webkit too*/
 font-size: 30px; /*Now in webkit too*/
}

Another workaround is to style the <select> element with -webkit-appearance: menulist-button;.

select { -webkit-appearance: menulist-button; font-size: 25px; }

<select>
    <option>A</option>
    <option>BB</option>
    <option>CCC</option>
</select>

Some browsers will allow you to modify the font-size on its own and some will not.

You can hack the browser-specific style of a select element by setting a border style.

select {
  border: 1px solid #ccc;
  font-size: 2em;
}

<select>
    <option>Quick</option>
    <option>Brown</option>
    <option>Fox</option>
</select>