title: Select:hover doesn't work
body: <p>I have a css drop menu that opens on mouse over, within the menu I've also a select-box. The problem is whenever i click on select box the menu disappears. </p>
  
  <p>what i've tried is to add <code>#year-select select:hover,</code></p>
  
  <p>css that opens menu</p>
  
  <pre><code>#menu li:hover .dropdown_1column, 
  #menu li:hover .dropdown_2columns, 
  #menu li:hover .dropdown_3columns,
  #menu li:hover .dropdown_4columns,
  #year-select select:hover,
  #menu li:hover .dropdown_5columns {
      left:-1px;
      top:auto;
  }
  </code></pre>
  
  <p>html</p>
  
  <pre><code>&lt;select name="year-select" ONCHANGE="location = this.options[this.selectedIndex].value;"&gt;
          &lt;option value="2012"&gt;
  ...
  &lt;/select&gt;
  </code></pre>
  
  <p><a href="http://jsfiddle.net/B9eUM/" rel="nofollow">http://jsfiddle.net/B9eUM/</a></p>