IE10 Select box menu shows upside

Question

I was testing my application in IE10 and found a strange behavior for select box. The option selected is highlighted and options above/below are displayed above/below the s

Answer 1

This is the default behavior of select tag in IE10. That is a pretty good look.

If you watch carefully, the option is opened based on the position allotted.

I have figured a work around using jQuery,

var position = $("select").on('change', function () {
    position.find('option:selected').prependTo(position);
});

How it works:

Whenever you change an option, the selected option will be prepended(in simple moved) to the first position.

I have create a JSFiddle to show how it works, check it in IE.

If you're not interested in this feature, then you have look for some plugins.

My most favorite plugins are:

1. Chosen
2. Select2

Hope you can understand.