Hallo Tutorianer; ... hallo Maik ,

ich bin gerade dabei ein dynamisch erstelltes Menü mit unterschiedlichen Grafiken je Button unzusetzen. Das Konzept ist sicher nicht das gelbe vom Ei.

Beim neuen IE und FF funktioniert es so:

CSS:

HTML-Code:

#main_menu{ width: 162px; font-size: 1em; font-family: "Lucida Grande", Verdana, sans-serif; font-weight: bold; list-style-type: none; display: block; margin: 0; padding: 0px 0px 0px 0px; overflow: hidden; }
#main_menu ul { list-style-type: none; width: 162px; display: block; margin: 0; padding: 0; }
#main_menu li { list-style-type: none; width: 162px; display: block; margin: 0px; padding: 0;}
#main_menu li a { list-style-type: none; width: 129px; height: 33px; line-height: 33px; text-decoration: none; display: block; padding: 0px 0px 0px 33px; margin: 0px 0px 10px 0px; color: #666; }
#main_menu li a:hover { color: #333; }
#main_menu li a.current { color: #000; }
#main_menu li a.menu-object-1{background: url("/fileadmin/templates/img/menue_ia.png") no-repeat;}
#main_menu li a.menu-object-1:hover {background: url("/fileadmin/templates/img/menue_01_01.png") no-repeat;}
#main_menu li a.menu-object-1.current {background: url("/fileadmin/templates/img/menue_01_02.png") no-repeat;}
#main_menu li a.menu-object-2{background: url("/fileadmin/templates/img/menue_ia.png") no-repeat;}
#main_menu li a.menu-object-2:hover {background: url("/fileadmin/templates/img/menue_02_01.png") no-repeat;}
#main_menu li a.menu-object-2.current {background: url("/fileadmin/templates/img/menue_02_02.png") no-repeat;}

HTML:

HTML-Code:

<div id="main_menu">
<ul>
<li>
<a href="index.php?id=2"  class="menu-object-1 current">Startseite</a>
</li>
<li>
<a href="index.php?id=6"  class="menu-object-2">Service</a>
</li>
</ul>
</div>

Beim IE6 weiche ich auf eine andere CSS-Datei aus (Browserweiche), was soweit auch funktioniert, nur leider finde ich nicht die richtigen CSS-Einstellungen, damit jeder Button der "current" ist, auch die jeweils für sich bestimmte Grafik anzeigt! IE6 zeigt immer die vom letzten Button definierte current-Grafik an.

Alles was ich in den letzten Tagen versucht habe hat nicht geklappt. Könnt Ihr mir bitte einen Tip geben?

Gruß, Grille.

Hi,

ich kann den Beitrag leider nicht finden, in dem vor geraumer Zeit derselbe IE6-Problemfall mit den kombinierten Klassen in einem Navigationsmenü vorgestellt wurde. War vielleicht auch eine Zweitfrage in einem Thema mit anderem Ausgangsproblem und Betreff.

Mein Alternativ-Vorschlag lautet hier, die Klasse .current dem <li>-Element zu übergeben.

HTML-Code:

<li class="current">
<a href="index.php?id=2"  class="menu-object-1">Startseite</a>
</li>

Code css:

1	#main_menu li.current a.menu-object-1 {background: url("/fileadmin/templates/img/menue_01_02.png") no-repeat;}

mfg Maik