[CSS] Menu ie bug

[Verwijderd]

Een vervelend probleempje met Internet Explorer. Ik ben bezig met een horizontaal uitklapbaar menu dmv CSS. In firefox gaat alles perfect alleen IE doet vervelend. Heb even twee plaatjes gemaakt om het duidelijker te maken wat mijn probleem is.

IE:


FF:


Door middel van height:40px (de hoogte van het menu) toe te voegen aan de style van het <a> element verdwijnt de blauwe balk onder de buttons wel maar dan verplaatsen de sub items zich naar rechts van de parent. Iemand die hier een oplossing voor heeft? Het gaat trouwens om IE 7.

De css van het menu:

Cascading Stylesheet:

#menuh
    {
    font-size: small;
    font-family: arial, helvetica, sans-serif;
    width:100%;
    float:left;
    margin:0;
    padding: 0;
    }
        
#menuh a.top
    {
    text-align: center;
    display:block;
    margin:0;
    padding: 0;
    height: 40px;
    }

#menuh a
    {
    display:block;
    float: left;
    clear: left;
    }

#menuh li>a {
    float: none;
}
    
#menuh a, #menuh a:visited
    {
    color: white;
    background-color: royalblue;
    white-space:nowrap;
    text-decoration:none;
    }
    
#menuh a:hover  /* menu at mouse-over  */
    {
    color: white;
    background-color: cornflowerblue;
    }   

#menuh ul
    {
    list-style:none;
    margin:0;
    padding:0;
    }

#menuh li
    {
    position:relative;
    min-height: 1px;    /* Sophie Dennis contribution for IE7 */
    vertical-align: bottom; /* Sophie Dennis contribution for IE7 */
    float: left;
    }

#menuh ul ul
    {
    position:absolute;
    z-index:100;
    top:auto;
    display:none;
    padding: 1em;
    margin:-1em 0 0 -1em;
    }
    
#menuh ul ul li
    {
    float: none;
    width: 100px;
    }

div#menuh li:hover ul ul,
div#menuh li li:hover ul ul,
div#menuh li li li:hover ul ul
div#menuh li li li li:hover ul ul
{display:none;}

div#menuh li:hover ul,
div#menuh li li:hover ul,
div#menuh li li li:hover ul,
div#menuh li li li li:hover ul
{display:block;}

[Verwijderd]

Iemand misschien nog een ideetje?

[Rekcor]

heb je ook de html voor ons?

[Verwijderd]

HTML:

<ul>
    <li><a href='http://192.168.1.61/index.php?page=1'><img src='images/nl/menu_home.gif' alt='Home' border=0 /></a></li>
    <li><img src='images/menu_sep.gif' alt='Menu Seperator' /></li>
</ul>
<ul>
    <li><a href='http://192.168.1.61/index.php?page=2'><img src='images/nl/menu_producten.gif' alt='Producten' border=0 /></a>
        <ul>
            <li><a href='Product een'>Product een</a></li>
            <li><a href='Product twee'>Product twee</a></li>
        </ul>
    </li>
    <li><img src='images/menu_sep.gif' alt='Menu Seperator' /></li>
</ul>
<ul>
    <li><a href='http://192.168.1.61/index.php?page=3'><img src='images/nl/menu_diensten.gif' alt='Diensten' border=0 /></a></li>
    <li><img src='images/menu_sep.gif' alt='Menu Seperator' /></li>
</ul>
<ul>
    <li><a href='http://192.168.1.61/index.php?page=4'><img src='images/nl/menu_formule.gif' alt='Formule' border=0 /></a></li>
    <li><img src='images/menu_sep.gif' alt='Menu Seperator' /></li>
</ul>
<ul>
    <li><a href='http://192.168.1.61/index.php?page=5'><img src='images/nl/menu_partners.gif' alt='Partners' border=0 /></a></li>
    <li><img src='images/menu_sep.gif' alt='Menu Seperator' /></li>
</ul>
<ul>
    <li><a href='http://192.168.1.61/index.php?page=6'><img src='images/nl/menu_referenties.gif' alt='Referenties' border=0 /></a></li>
    <li><img src='images/menu_sep.gif' alt='Menu Seperator' /></li>
</ul>
<ul>
    <li><a href='http://192.168.1.61/index.php?page=7'><img src='images/nl/menu_contact.gif' alt='Contact' border=0 /></a></li>
</ul>