Rolli: IE5.x und 6 - Vererbung wird falsch interpretiert

Beitrag lesen

Hallo Forum,

ich habe eine Seite mit dem CMS Website Baker erstellt. Das Menü wird mittels show_menu2 generiert (der ein oder andere wird es kennen).

Daher werden den Menüpunkten u.a. folgende CSS-Klassen automatisch zugewiesen:

Eintrag im Hauptmenü : aktiv

<li class="menu-1 menu-expand menu-current">

Eintrag im Submenü : aktiv

<li class="menu-2 menu-current">

Ich möchte beide Einträge unterschiedlich formatieren und habe folgendes CSS erstellt:

li.menu-1, li.menu-2 {  
 list-style-type: none;  
}  
li.menu-1 a {  
 padding-top: 0px;  
 padding-right: 50px;  
 padding-bottom: 0px;  
 padding-left: 0px;  
 background-image: url(img/bg_menu-1.gif);  
 background-position: right top;  
 font-family: Arial, Helvetica, sans-serif;  
 font-size: 12px;  
 font-weight: normal;  
 color: #999999;  
 text-decoration: none;  
 display: block;  
 height: 53px;  
}  
li.menu-1 a:hover {  
 background-image: url(img/bg_menu-1_hover.gif);  
 background-repeat: no-repeat;  
 background-position: right top;  
 color: #666666;  
}  
li.menu-1.menu-current a, li.menu-1.menu-current a:hover {  
 text-decoration: none;  
 color: #EC0000;  
 list-style-type: none;  
 font-family: Arial, Helvetica, sans-serif;  
 font-size: 12px;  
 font-weight: normal;  
 background-image: url(img/bg_menu-1_current.gif);  
 background-repeat: no-repeat;  
 background-position: right top;  
}  
li.menu-1.menu-parent a, li.menu-1.menu-parent a:hover {  
 text-decoration: none;  
 color: #EC0000;  
 background-image: url(img/bg_menu-1_current.gif);  
 background-repeat: no-repeat;  
 background-position: right;  
}  
li.menu-2 {  
 padding-top: 0px;  
 padding-right: 0px;  
 padding-bottom: 8px;  
 padding-left: 30px;  
}  
li.menu-2.menu-current a, li.menu-2.menu-current a:hover {  
 font-family: Arial, Helvetica, sans-serif;  
 font-size: 12px;  
 font-weight: normal;  
 color: #EC0000;  
 text-decoration: none;  
}  

Der Code wird von fast allen Browsern richtig interpretiert. Lediglich die IE 5.x und 6 Serie macht einen Fehler.

Hier wird dem Eintrag li.menu-2.menu-current a das Attribut background aus li.menu-1.menu-current a zugewiesen, bzw. vererbt.

Wie kann ich die Klassenkombination aus menu-1, menu-2 und menu-current so ansprechen, dass auch der IE6 sie richtig interpretiert?

Danke für eure Mithilfe,

Rolli