title: Can I control positioning of IE 10 select boxes?
body: <p>In Internet Explorer 10 the behavior of drop-down boxes (<code>&lt;select&gt;</code> element) has changed: when expanding the box, instead of placing the list of options below the field, the list overlays the field, with the list positioned so that the currently-selected element is centered over the input field.</p>
  
  <p>This is a little hard to describe, <a href="http://jsfiddle.net/KnAXL/" rel="nofollow noreferrer">so here's a jsFiddle that shows it</a>.</p>
  
  <p>Our users are finding this behavior very confusing. Is there anything I can do in CSS to make the box behave like it did in IE9, and like every other major browser? (Perhaps something like the <a href="https://stackoverflow.com/questions/14007655/remove-ie10s-clear-field-x-button-on-certain-inputs">-ms-clear pseudo-element</a> that hides the clear button in IE10 text input fields.)</p>
  
  <p>Here's a sort of time-lapse screenshot:</p>
  
  <p><img src="https://i.stack.imgur.com/ukIZs.png" alt="IE 10 select box behavior screenshot"></p>