Aktuellen Menüpunkt highlighten

[Sebastian Becker]

Hallo,

kann mir vielleicht netterweise jemand mal beim Debuggen helfen?! Ich komme einfach nicht weiter.

Die Aufgabe scheint ganz leicht: Der aktuelle Menüpunkt, der mit der CSS-Klasse "current_page_item" gekennzeichnet ist, soll eine andere Farbe bekommen und dazu die bestehende Definition überschreiben. Das klappt aber nicht ...

Danke und Grüße,

Sebastian

<style>  
/* general menu style */  
.Menu { width: 470px; padding: 0px 0px 0px 30px; float: left; position: absolute;  top: 100px; }  
.Menu ul { list-style: none; margin: 0px; padding: 0px;}  
.Menu ul li { padding: 0px; margin: 0px; display: inline; font-size: 14px; line-height: 14px; font-weight: bold; font-family: "Trebuchet MS"; }  
.Menu ul li a { padding: 0px 0px 0px 9px; float: left; text-decoration: none;}  
.Menu ul li a span { padding: 4px 9px 9px 0px; display: block; float: none; color: #cc0000;}  
.Menu ul li a:hover { color:#000000;}  
.Menu ul li a:hover span { color: #000000; }  
  
/* current page menu style */  
.Menu ul li .current_page_item a span { color: #000000;}  
</style>  
  
<div class="Menu">  
<ul>  
<li class="current_page_item"><a href="#"><span>current page</span></a></li>  
<li><a href="#"><span>some other page</span></a></li>  
</ul>  
</div>

[LX]

Hallo!

/* current page menu style */
.Menu ul li .current_page_item a span { color: #000000;}

Das Leerzeichen zwischen li und .current... ist zu viel - auf diese Weise würde ein Element zwischen li und a mit der entsprechenden Klasse angesprochen.

Gruß, LX

[Sebastian Becker]

Hallo!

/* current page menu style */
.Menu ul li .current_page_item a span { color: #000000;}
Das Leerzeichen zwischen li und .current... ist zu viel - auf diese Weise würde ein Element zwischen li und a mit der entsprechenden Klasse angesprochen.

Gruß, LX

Scheint logisch und funktioniert, Danke vielmals!

Grüße, Sebastian