Aktiver Navipunkt wird nicht farblich verändert

Aloha

Hallo, liebes Forum,

ich stehe gerade leider ein wenig auf dem Schlauch:

Auf dieser Seite hier habe ich gerade per CSS eingerichtet, dass der aktive Menüpunkt dasselbe Verhalten wie das hover-Element zeigt. Das habe ich mit der Anleitung auf perun.net erreicht.

Jetzt sehe ich im Firebug, dass die Bedingung, die ich für die ul im navi-inside-Div formuliert habe, nämlich dass die Textfarbe dunkelrot sein soll, meine gewünschte Textfarbe für den aktiven Menüpunkt (weiß) leider überschreibt.

Hier der CSS-Code:

HTML

/* navigation mit css-rollover */


div#navi-inside ul {
    margin: 0;
    padding: 0;
    list-style:none;
}


div#navi-inside ul {
    text-align: left;
    overflow: hidden;
    width: 98%;
}


div#navi-inside li {
    float: left;
}


div#navi-inside li a {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 1em;
    font-weight: bold;
    color: #b9520e;
    padding: 11px 11px 21px 11px;
    display: block;
    text-decoration: none;
    float: left;
    display: inline;
}


div#navi-inside li a:hover {
    color: #ffffff;
    background: url(images/dreieck.gif) left top no-repeat;
}


/* Aktiver Menuepunkt */
.page_item a:hover, .current_page_item a {
    color: #ffffff;
    background: url(images/dreieck.gif) left top no-repeat;
}

Alles anzeigen

Das betroffene div sieht so aus:

HTML

<div id="navi-inside">
      <ul>
      <?php wp_list_pages('title_li=&depth=1'); ?>
      </ul>
     </div>

Ich bin gerade etwas ratlos, wie ich dem Browser sagen kann, dass er doch bitte die Klasse für den aktiven Menüpunkt bevorzugt behandelt...

Könnt ihr mir bitte helfen? Vielen Dank schonmal!

Werbepost

Hallo!

Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
✔️ Deutsche Server & DSGVO-konform
✔️ Persönlicher Support (kein 0815-Ticket-System)

Mehr erfahren

maxe

Entweder du machst ein !important hinter deine Formatierungen oder aber du machst es so:

Code

/* Aktiver Menuepunkt */
.page_item a:hover, [COLOR=Red]div#navi-inside li[COLOR=Black].[/COLOR][/COLOR]current_page_item a {
    color: #ffffff;
    background: [URL="http://forum.wordpress-deutschland.org/lexikon/?do=showentry&item=url"]url[/URL](images/dreieck.gif) left top no-repeat;
}

Aloha

Hooray! Works like a charm!!!

Tausend Dank, maxe!!! Ich komm immer durcheinander mit diesen ganzen Verschachtelungen in CSS2... :oops:

Willkommen! Melden Sie sich an oder registrieren Sie sich.

Aktiver Navipunkt wird nicht farblich verändert

Jetzt mitmachen!