css - Change IE background color on unopened, focused select box

Question

I'd like to change the blue background color from IE when a drop down is focused, but I can't seem to find any CSS to do this.

<select id=focusSelect><option>Option</option></select>

JS:

document.getElementById("focusSelect").focus();

CSS:

select:focus{
    background-color: red;
}

http://jsfiddle.net/TafDD/3/

Specifically this is for when the drop down is not open. Styling the options is not a problem.

I also can't find any definitive answer on whether this is possible to do at all.

Setting the option background color also does not clear the blue color.

option {
    background-color: green;
}

http://jsfiddle.net/srycroft/yE2Zg/

Answer 1

In Internet Explorer 11/Edge (not sure about previous versions) you can do this:

select:focus::-ms-value {
    color: black; 
    background: red;
}

You should also specify the font color because it otherwise defaults to white (to originally contrast against the blue), so you'll want to override it too.

Here's a dabblet demo