[css] raar probleem met menu en een div

[paragon]

Ik heb een menu dat uitklpat wanneer je er met de pointer overheen hooverd(display:none --> display:block. Dit werkt prima maar als je dan met de pointer binnen het uitgeklapte stuk blijft maar over een bepaalde div(#content) heen gaat veranderd de display weer naar none wat dus niet het geval is. Hieronder even 2 voorbeelden:

normaal gepositioneerd: http://paragonxls.xs4all.nl/php/pulpo
lastige div naar beneden geplaatst: http://paragonxls.xs4all.nl/php/pulpo/test.php

Het menu bevint zich ook in een div(#nav)

code:

#nav {
    position:relative;
    margin-top:7px;
    margin-left:32px;
    z-index:2;
}

#content {
    position:relative;
    width:646px;
    max-height:300px;
    margin-top:0px;
    overflow:auto;
    background-image:url("../images/back.gif");
    z-index:1;
}

en het menu

code:

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

li{
    float:left;
    width:111px;
    border-top:1px solid #999;
    border-bottom:1px solid #999;
    text-align:center;
        background-color:#ddd;
}

li ul {
    position:absolute;
    display:none;
}

li:hover ul {
    display:block;
}

ul a {
    display:block;
    padding:3px 0;
    text-decoration:none;
    font-family:tahoma;
    font-size:12px;
    font-weight:bold;
    color:#444; 
}

ul a:hover {
    background-color:#fff;
}

li.sub {
    float:none;
    width:111px;
    border:0;
}

Heb al geprobeerd met de z-index te spelen en met de absolue/relative maar dat was niet positief.

BTW: werkt tot nu toe alleen in FF want ik moet nog js toevoegen voor IE.

[ Voor 9% gewijzigd door paragon op 04-11-2004 18:45 ]

[AkaXakA]

werkt

li:hover ul {
display:block;
z-index:4;
}

?

[paragon]

Nee dat werkt niet

[faabman]

komt door de overflow:auto... zelf gebruik ik javascript om de <li>'s een class mee te geven bij een onmouseover...

[paragon]

Hmm ja overflow:auto Is dit een bug of hoort dit gewoon zo te reageren? Anyways terug naar de javascript menus dan maar.

[Zoefff]

De 2e (test.php) doet het nu uitstekend bij mij hoor?

Ik heb een soortgelijk menu ook op mijn site staan, werkt zowel in FF als IE goed. Zie http://zoefff.gotdns.com/emulefaq voor een voorbeeld. Dat menu is trouwens geinspireerd op het menu in dit artikel http://www.naarvoren.nl/artikel/hover.html .

[paragon]

Ja dat klopt omdat ik de overflow:auto; had weggehaald. Maar dat was niet de bedoeling. Want die moet namelijk wel auto zijn.

[AkaXakA]

ja die 2e test werkt idd goed in FF (1.0RC2, dus ook in final als die uitkomt)

En als je behalve die all:hover ook andere leuke css(3) elementen wil gebruiken: http://dean.edwards.name/IE7/. IE7 is een javascript lib om IE (5-6) net zoals mozilla te laten gedragen bij het renderen van pagina's. Hoef je je meteen ook geen zorgen te maken over de vernachelde boxmodel van ie5.

[paragon]

Zoefff schreef op 04 november 2004 @ 22:18:
De 2e (test.php) doet het nu uitstekend bij mij hoor?

Ik heb een soortgelijk menu ook op mijn site staan, werkt zowel in FF als IE goed. Zie http://zoefff.gotdns.com/emulefaq voor een voorbeeld. Dat menu is trouwens geinspireerd op het menu in dit artikel http://www.naarvoren.nl/artikel/hover.html .

Ik merk dat bij jou een soortgelijk probleem aanwezig is. Als ik naar instellingen ga en dan naar beneden hover valt je sub-menu weer naar display:none als ik bij security kom. Helemaal boven in security doet ie het nog goed maar daarna niet meer. Dit in FF RC2.

[Zoefff]

Jup, maar dat is niet hetzelfde probleem. Zo rond security beginnen de google ads op de eerste pagina, en op de een of andere manier presteren die het om áltijd on top te staan, dus zodra je daar in de buurt komt valt het menu idd terug.

Op een willekeurige andere pagina werkt het menu wel goed. Ik moet nog even wat verzinnen op die ads