menü funktioniert in ie7 und 8 nicht

[d3x84]

hi zusammen,
mein navigationsmenü funktioniert in ie7 und 8 nicht...
welche möglichkeiten hab ich herauszufinden woran es liegt?
ja conditial comments usw...
aber ich muss ja herausfinden welche anweisungen er nicht schluckt...

hab schon versucht einiges nachzulesen komme aber leider auf keinen grünen zweig :/


Link zur Beta

#mainmenu {
    width:100%;
    position:relative;
    overflow:visible;
    z-index:1;
}

#mainmenu ul {
    margin:0;
    padding:0;
}

#mainmenu ul.level_1 {
    padding-top:10px;
}

#mainmenu ul.level_1 li {
    display:inline;
}

#mainmenu ul.level_1 span {
    font-size:24px;
    line-height:30px;
    text-decoration:none;
    color:#fff;
}

#mainmenu ul.level_1 li:hover {
    background-color:#497B7B;
}

#mainmenu ul.level_2 {
    display:none;
}

#mainmenu ul.level_1 li:hover > ul.level_2 {
    position:absolute;
    display:block;
}

#mainmenu ul.level_2 li {
    width:100%;
    display:block;
}

#mainmenu ul.level_1 li.first {
    padding:15px 10px 10px;
    border-right:1px solid #fff;
    margin:0 0 0 10px;
}

#mainmenu ul.level_1 li.first+li {
    margin:0;
    padding:15px 10px 10px;
    border-right:1px solid #fff;
}

#mainmenu ul.level_1 li.last {
    padding:15px 10px 10px;
}

#mainmenu ul.level_2 {
    padding:10px 15px;
    text-align:left;
    vertical-align:middle;
    background-color:#6dbbba;
    border:1px solid #D9F7F7;
}

#mainmenu ul.level_2 a, #mainmenu ul.level_2 a:active, #mainmenu ul.level_2 a:focus {
    font-size:18px;
    line-height:32px;
    text-decoration:none;
    color:#fff;
}

#mainmenu ul.level_2 li {
    right:10px;
    position:relative;
    background:url("tl_files/reneboehres4/image/list-style.png") left center no-repeat;
}

#mainmenu ul.level_2 li.first {
    margin:0;
    padding:0 0 0 15px;
    border:0px;
}

#mainmenu ul.level_2 li.first+li {
    border:0px;
    padding:0 0 0 15px;
}

#mainmenu ul.level_2 li.first+li+li {
    border:0px;
    padding:0 0 0 15px;
}

#mainmenu ul.level_2 li.first+li+li+li {
    border:0px;
    padding:0 0 0 15px;
}

#mainmenu ul.level_2 li.first+li+li+li+li {
    border:0px;
    padding:0 0 0 15px;
}

#mainmenu ul.level_2 li.first+li+li+li+li+li {
    border:0px;
    padding:0 0 0 15px;
}

#mainmenu ul.level_2 li.last {
    padding:0 0 0 15px;
}

#mainmenu ul.level_1 li ul.level_2 {
    left:10px;
}

#mainmenu ul.level_1 li+li ul.level_2 {
    left:223px;
}

#mainmenu ul.level_1 li+li+li ul.level_2 {
    left:328px;
}

[sandburg]

Also im IE8 schein das Menu keine Probleme zu bereiten - bleibt also der IE7! Wenn das Ganze ohne „menumatic“ funktionieren soll, würde ich mir noch einmal Gedanken über den Aufbau des Templates machen:

(1) Der „wrapper“ wird 150px runtergesetzt
(2) Im „header“ ist folgendes;

a.) „preheader“ der Inhalte über den Kopfbereich in den leeren Bereich schiebt

b.) „.mainmenu“

(3) Dann gibt es einen „afterheader“ mit dem Banner
(4) Es folgt der „container“

Warum nicht folgendes:

(1) „wrapper“ bleibt bei 0px
(2) Die Höhe im „header“ wird auf 400px (preheader + mainmenu + afterheader) gesetzt
(3) Jetzt „spielt“ sich alles im „header“ ab … zumindest werden die Untermenüs korrekt angezeigt :-)

Eventuell ist das der passende Weg?

Viele Grüße
- sandburg -

[d3x84]

keine schlechte idee ich werd es mal ausprobieren damit sollte auch das "border" problem des ie 7 behoben sein...