Current Link

[YoBear]

Hallo,

ich bin am verzweifeln...
Eigentlich weiß ich wie ich den momentan aktiven Link hervorheben kann. Habe das auch schon ein paar mal programmiert aber hier funktioniert das einfach nicht. Ich vermute, dass ich den Wald vor lauter Bäumen nicht sehe. Vielleicht seht ihr einen Fehler.

Wie gesagt möchte ich die momentan aktive Seite in der Navigationsleiste hervorheben. Mein Code für die Navigationsleiste sieht so aus:

<div id="top-nav">
        <ul>
            <li><a class="currentlink" href="index.html" >Startseite</a></li>
            <li><a href="Erklaerung.html">Erklärung</a></li>
            <li><a href="Zusatzinfo.html">Weitere Informationen</a></li>
            <li><a href="Kontakt.php">Anmeldung</a></li>
        </ul>
    </div>

Und hier mein Stylesheet:

#top-nav {
    width: 880px;
    height: 30px;
}
#top-nav ul {
    margin: 0px;
    padding: 0px;
    height: 30px;
}
#top-nav li {
    float: left;
    width: 220px;
    text-align: center;
    font-family: "Franklin Gothic Medium", "Arial Narrow", Arial, sans-serif;
    height: 30px;
    line-height: 30px;
    font-size: 15px;
    color: #777782;
}
#top-nav a, #top-nav a:link, top-nav a:visited {
    display: block;
    background-color: #FFFFFF;
    text-decoration: none;
    color: #777782;
    background-repeat: no-repeat;
    background-image: url('images/button.png');
}
#top-nav a:hover {
    background-image: url('images/button_hover.png');
    background-repeat: no-repeat;
}

.currentlink {
    text-decoration: none;
    background-repeat: no-repeat;
    background-image: url('images/button_current.png');
}

Vielen Dank für die Hilfe!

Bear

 

[struppi]

Die Ursache dürfte die Spezifität sein. Das einfachste ist: #top-nav a.currentlink

 

[YoBear]

Danke! Funktioniert. Empfinde diese neu erlangte Wissen wie ein Levelup!