Internet Explorer 11 select element border

Question

There is a huge black border in Internet Explorer 11 around the options, when you click on select element.

http://jsfiddle.net/as2ge/

Anybody knows how to remove it?

Answer 1

The border appears to be intrinsic to the popup window displaying the menu. (You can test this with your fiddle by pressing Alt to display the menu and then choosing View | Style | No Style. It take a bit of scrolling, but when you get down to the rendered element, you'll see that the popup window still uses the larger border.

That border, BTW, is as an visual indicator meant to draw attention to the popup as a touch target. AFAIK, the only way to manage that would be to override the default window style, probably using a BHO. That would only work in IE for the desktop. (It would be ignored in the Windows Store presentation of IE.)

There are a number of proprietary pseudo selectors available, but none appear to affect the popup. (Your testing may be more successful than mine.)

You might consider looking for a relevant suggestion in IE's UserVoice suggestion box. If you find it, vote it up. If there isn't one, you could add one and advocate for it. According to the IE dev team, they're actively reviewing and considering this feedback.

Finally, I don't think there's a supported way to modify the browser's default stylesheets. (I'm reasonably certain there isn't a current reference to the default stylesheets.) Perhaps there should be, but that would likely need another entry in the suggestion box. :-)

Hope this helps...