Axel Richter: positon:relative + absolute - IE macht probleme

Beitrag lesen

Hallo,

Mein Problem ist, dass der IE die absolut positionierte Liste (Level-1 bzw. 2 Submenü) unter den relativ positionierten restlichen Listenelementen  der übergeordneten Liste(Hauptmenü bzw Level1-Submenü) anzeigt.
Hier ist eine Beispieldatei mit dem ganzen Code (auch IE6 JS-fix).
http://www.c-gabriel.at/test/index.html

Lass die (ul.menu li) zunächst in position:static und nimm sie erst bei hover in position:relative. Mach das im CSS und auch im JavaScript.

CSS:
...
ul.menu li {
        padding:3px;
        width:134px;
        color:inherit;
        background-color:#999;
        border-top:1px solid #FFF;
        border-right:1px solid #FFF;
        border-left:1px solid #FFF;
}
ul.menu li:hover {
        position:relative;
}
ul.menu li:hover > ul {
        display:block;
}
...

JavaScript:
var IE = (window.navigator.systemLanguage && !window.navigator.language)? 1 : 0;
function show(e) {
        if(IE) e.style.position = 'relative';
        if(IE) e.lastChild.style.display = 'block';
}
function hide(e) {
        if(IE) e.style.position = 'static';
        if(IE) e.lastChild.style.display = 'none';
}

Ich habe mir erlaubt, Deinen Test auf IE-Browser so abzuwandeln, dass Opera nicht darunter fällt, wenn er sich, wie standardgemäß festgelegt, als IE ausgibt.

Bzw. kann mir vl noch wer sagen, ob das Menü mit standardkompatiblen Browsern unter Mac und Linux läuft?

Nein, kann ich im Moment nicht testen.

viele Grüße

Axel