title: Get drop-down menu displaying right in Internet Explorer 11
body: <p>Well, here's my problem. I've created a very simple drop-down menu form, using JavaScript and HTML (and of course the internet). It opens up a page in the frame located below, which works perfectly in Chrome. It does work in Internet Explorer, but if you select an option lower in the list, close the menu and re-open it, the options &quot;float&quot; over the form.</p>
  <pre><code>&lt;form action=&quot;../cgi-bin/redirect.pl&quot; 
  method=post onSubmit=&quot;return dropdown(this.selection)&quot;
  target=&quot;Frame2&quot;&gt;
  
  &lt;select name=&quot;selection&quot;&gt; 
  &lt;option value=&quot;&quot;&gt;Choose an option:
  &lt;option value=&quot;2012-2013.html&quot;&gt;2012/2013
  &lt;option value=&quot;2011-2012.html&quot;&gt;2011/2012
  &lt;option value=&quot;2010-2011.html&quot;&gt;2010/2011
  &lt;option value=&quot;2009-2010.html&quot;&gt;2009/2010
  &lt;/select&gt;
  &lt;input type=submit value=&quot;Choose&quot;&gt;
  &lt;/form&gt;
  </code></pre>
  <p>And here's the JavaScript:</p>
  <pre><code>function dropdown(mySel){
  var myWin, myVal;
  myVal = mySel.options[mySel.selectedIndex].value;
  if(myVal) {
  if(mySel.form.target)myWin = parent[mySel.form.target];
  else myWin = window;
  if (! myWin) return true;
  myWin.location = myVal; }
  return false;}
  </code></pre>
  <p>As you can see in <a href="http://oi43.tinypic.com/25p30vs.jpg" rel="nofollow noreferrer">this</a> image, it functions as it should in Google Chrome. But not in <a href="http://oi42.tinypic.com/121wytv.jpg" rel="nofollow noreferrer">Internet Explorer</a>
  , and a lot of people still use that browser. I don't really need these fancy CSS menu's there are today, this is more than good enough. My question is: is there a solution to display the dropdownmenu in IE like it's displayed in Chrome?</p>
  <p>I've already tried to set classes to the form, select and option tags to set the top of them, but that didn't solve the problem for me. Any ideas?</p>