Die <li>'s einer <ul> verschiedenene Klassen zuordnen

[Gunnar Bittersmann]

@@Ralf:

nuqneH

<ul id="hNav">
<li class="activeHNav"><a href="?bqGroup=101">Gruppe 101</a></a></li>
<li><a href="?bqGroup=102">Gruppe 102</a></a></li>
<li><a href="?bqGroup=103">Gruppe 103</a></a></li>
<li><a href="?bqGroup=999">Gruppe 999</a></a></li>
</ul>

Was mache ich falsch?

Du schließt 'a'-Elemente, die gar nicht offen sind. Das hätte dir der Validator auch gesagt.

Du öffnest 'a'-Elemente, wo du gar nicht verlinken solltest: „Verlinke niemals auf die aktuelle Seite.“ (Punkt 10 der zehn meist-missachteten Homepage-Design-Richtlinien [Nielsen])

Dein Code sollte eher so aussehen:

<ul id="hNav">  
        <li>Gruppe 101</li>  
        <li><a href="?bqGroup=102">Gruppe 102</a></li>  
        <li><a href="?bqGroup=103">Gruppe 103</a></li>  
        <li><a href="?bqGroup=999">Gruppe 999</a></li>  
</ul>

Eine Klasse zu Kennzeichnung des gewählten Menüpunkts brauchst du nicht.

Oder in HTML5:

<nav id="hNav">  
    <ul>  
        <li><a>Gruppe 101</a></li>  
        <li><a href="?bqGroup=102">Gruppe 102</a></li>  
        <li><a href="?bqGroup=103">Gruppe 103</a></li>  
        <li><a href="?bqGroup=999">Gruppe 999</a></li>  
    </ul>  
</nav>

Dann hast du sowohl 'li'- als auch 'a'-Element zum Stylen zur Verfügung. Unterscheidung aktuller vs. andere Menüpunkte per '#hNav a' bzw. '#hNav a[href]'.

Qapla'