Dropdown-menu - In FF goed in IE fout

[mklcln]

Hallo,

Ben bezig met site. Nu heb ik het volgende probleem ik krijg in IE het dropdown-menu niet naar voorgrond.

Voorbeeldje:
http://verkoop.it-prospect.nl/xpackd/

Code CSS:

Cascading Stylesheet:

 
/***** Algemeen *****/
html, body
{
    margin: 0px;
    padding: 0px;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
* { padding: 0px; margin: 0px;}
#content {
    font: 10px Arial;
    text-decoration: none;
    color: #494848;
}
body, a, p, #menu, #footer{
    font: 10px Arial;
    text-decoration: none;
    color: #fff;
}
input.type {
    font: 10px Arial;
    color: #494848;
    border: 1px solid #000;
    height: 18px;
    width: 127px;
    vertical-align:middle;
}
fieldset { border: 0; }

/***** Layout *****/
div#header
{
    top: 0px;
    height: 130px;
    width: 100%;
    padding-top: 22px;
    background: #FFF url('../images/header_bg.gif') repeat-x top;

}
#logo {
    position: relative;
    top: 4px;
    left: 65px;
    bottom: 7px;
} 
div#menu
{
    position: absolute;
    margin-top: 130px;
    top: 0px;
    height: 24px;
    width: 100%;
    background: #FFF url('../images/menu_bg.gif') repeat-x;
    border: 1px solid #000;
}
div#content
{
    top: 0px;
    bottom: 0px;
    margin-top: 156px;
    margin-bottom: 100px;
    width: 100%;
}
div#footer
{
    background: url(../images/footer_bg.gif) repeat-x;
    height: 60px;
    width: 100%;
        position: absolute; 
    bottom: 0;
}
/***** Menu *****/
#nav, #nav ul { /* all lists */
    padding: 0;
    margin: 0;
    list-style: none;
    line-height: 1;
}
#nav a { display: block; width: 10em; }
#nav li { /* all list items */
    padding-top: 5px; 
    padding-left: 10px; 
    padding-right: 10px;
    float: left;
    width: 10em; /* width needed or else Opera goes nuts */
}
#nav li ul { /* second-level lists */
    position: absolute;
    background: #454545;
    border: 1px solid #000;
    width: 150px;
    left: -999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */
    z-index: 100;
}
#nav li:hover ul, #nav li.sfhover ul { /* lists nested under hovered list items */
    left: auto;
}
li.separator { 
    background: url(../images/menu_scheiding.gif) no-repeat; 
    width: 2px;
    height: 24px;
    font-size: 0px;
}
li.menu_left { width: 50px; font-size: 0px;}
li.menu_right { width: 20px; font-size: 0px;}
/***** Inhoud *****/
h1 {
    width: 100%;
    height: 23px;
    text-indent: 10px;
    border-bottom: 1px solid #d1d1d1;
    margin-bottom: 1px;
    cursor: pointer;
    background: #000;
}
h1 a {
    display: block;
    background: #00aeef;
    line-height: 23px;
    font-size: 10px;
    color: #fff;
    outline: none;  
}
h1 a:active, a.active {
    border-bottom: 1px solid #d1d1d1;
    background: #00aeef;
}
h1 a, h1 a:link, h1 a:visited, h1 a:hover, h1 a:active {
    font-weight: bold;
    text-decoration: none;
    color: #fff;
}
.accordion p {
    border: 1px solid #eaeaea;
    background: #f4f4f4;
    padding: 10px 6px 15px 6px;
    color:#494848;
}
/***** Login *****/
div.login {
    background: #f4f4f4;
    padding: 5px;
    font: 10px Arial;
    color: #494848;
    width:228px;
    border: 1px solid #eaeaea;
}
/***** Keuze *****/
div.keuze {
    background: #f4f4f4;
    padding: 5px;
    font: 10px Arial;
    color: #494848;
    width:228px;
    border: 1px solid #eaeaea;
}
font.kop {
    font: 12px Arial;
    font-weight: bold;
    color: #494848;
}
/***** Footer *****/
#copyright {
    padding-left: 15px;
    margin: 10px;
    color: #fff;
    float: left;
    text-align: left;
}
#links {
    padding-right: 20px;
    margin: 10px;
    color: #fff;
    text-align: right;
    float: right;
}
 

[kunnen]

In FF goed? Ik kan niet op de menu's klikken, ze verdwijnen wanneer ik met mijn muis erover wil gaan.

[mklcln]

Dat moet nog fixen maar bedoel eigenlijk in IE komen ze niet naar de voorgrond.

[Xer0X]

Hier hetzelfde

[PierreG]

In opera verdwijnen de menu's ook wanneer ik met mijn muis erover wil gaan. Ik denk niet dat je het probleem bij IE moet zoeken.

[disjfa]

gewoon niet alles absoluut positioneren.

[mklcln]

disjfa schreef op zaterdag 12 januari 2008 @ 16:06:
gewoon niet alles absoluut positioneren.

Lag inderdaad aan 2 positions deze heb ik nu weggehaald en het werkt.
Thanks!

Heb tevens nog een vraag.
Weet iemand hoe ik submenu onder de zwarte balk kan krijgen zonder dat menu telkens verdwijnt
Had voorheen namelijk margin-top toegevoegd maar dit was niet goed.

[ Voor 29% gewijzigd door mklcln op 12-01-2008 16:14 ]

[MsG]

Misschien nog een tip: Alleen als je expliciet over de tekst zelf heen gaat, of de rechterkant van de tekst tot aan de volgende knop, komt het menu. Als je het linkerknopgedeelte voor de tekst aan mouse-over-'d, gebeurt er niks, misschien handiger om het menu te laten verschijnen als je over de knop zelf al gaat.

[7.01D]

dpz schreef op zaterdag 12 januari 2008 @ 16:11:
Heb tevens nog een vraag.
Weet iemand hoe ik submenu onder de zwarte balk kan krijgen zonder dat menu telkens verdwijnt
Had voorheen namelijk margin-top toegevoegd maar dit was niet goed.

Padding-top misschien, padding valt immers binnen het element en margin erbuiten. Zaken als :hover werken dus wel op de padding, maar niet op de margin.