title: Dropdown menu not working properly on IE8
body: <p>I'm trying to make this dropdown menu functional... but I almost give up trying to make it works on IE8, though it works on IE7...</p>
  
  <pre><code>http://jsfiddle.net/MgcDU/5137/
  </code></pre>
  
  <p>The problem is that on IE8 when the dropdown menu is displayed, it seems to be like... invisible? I move the mouse over it and I can see the links appearing in the status bar, but nothing else.</p>
  
  <p>Image of the problem:
  <a href="http://tinypic.com/r/2uqdpqd/5" rel="nofollow">http://tinypic.com/r/2uqdpqd/5</a></p>
  
  <p>I think the problem is related to some inherited style from bootstrap, as out of it, it seems to work.</p>
  
  <p>I've tried jQuery to solve the problem, forcing the children ul to be shown as block once the mouse move over the parent li, but it's not what I'm looking for.</p>
  
  <p>Also I had to remove some of the styles that Joomla was trying to include in the navigator block.</p>
  
  <pre><code>jQuery(document).ready(function () {
  if (!jQuery("html").hasClass()) {
      // dropdown
      jQuery('.parent').addClass('has-sub');
      jQuery('.cssmenu &gt; ul').removeClass();
      jQuery('.cssmenu ul li &gt; ul').removeClass();
      jQuery('.cssmenu ul li &gt; ul').addClass('unstyled');
  };});
  </code></pre>
  
  <p>What am I doing wrong?</p>
  
  <p>Thank you very much!</p>