[ERLEDIGT] Anpassen der Subnavi

[HannemannMediaAG]

Hallo,

ich möchte das Aufklappmenü anpassen. Es passt soweit alles, nur komme ich mit dem Status "current" nicht klar, denn dieser wird immer von der Klasse der "Hauptnavigation" übernommen.

Wie kann ich der Klasse "main-navigation li ul li a" eine "current-class" vergeben?

Hier der CSS-Code (im unteren Teil sind die Klassen der Hauptnavigation):

.main-navigation li ul li a {
        background: #fff;
        border-bottom: 3px solid #fff;
        display: block;
        font-size: 11px;
        font-size: 0.785714286rem;
        line-height: 2.181818182;
        padding: 8px 10px;
        padding: 0.571428571rem 0.714285714rem;
        width: 180px;
        width: 12.85714286rem;
        white-space: normal;
        color: #152346;
    }
    .main-navigation li ul li a:hover {
        background: #fff;
        color: #5d236e;
    }
   
    .main-navigation .current-menu-item > a,
    .main-navigation .current-menu-ancestor > a,
    .main-navigation .current_page_item > a,
    .main-navigation .current_page_ancestor > a {
        color: #fff;
        font-weight: normal;
        border-bottom: 3px #9b0e6b solid;
        height: 40px;
       
    }

Besten Dank und viele Grüsse

 

[scbawik]

Hallo,

ich möchte das Aufklappmenü anpassen. Es passt soweit alles, nur komme ich mit dem Status "current" nicht klar, denn dieser wird immer von der Klasse der "Hauptnavigation" übernommen.

Wie kann ich der Klasse "main-navigation li ul li a" eine "current-class" vergeben?

Hier der CSS-Code (im unteren Teil sind die Klassen der Hauptnavigation):

.main-navigation li ul li a {
        background: #fff;
        border-bottom: 3px solid #fff;
        display: block;
        font-size: 11px;
        font-size: 0.785714286rem;
        line-height: 2.181818182;
        padding: 8px 10px;
        padding: 0.571428571rem 0.714285714rem;
        width: 180px;
        width: 12.85714286rem;
        white-space: normal;
        color: #152346;
    }
    .main-navigation li ul li a:hover {
        background: #fff;
        color: #5d236e;
    }
  
    .main-navigation .current-menu-item > a,
    .main-navigation .current-menu-ancestor > a,
    .main-navigation .current_page_item > a,
    .main-navigation .current_page_ancestor > a {
        color: #fff;
        font-weight: normal;
        border-bottom: 3px #9b0e6b solid;
        height: 40px;
      
    }

Besten Dank und viele Grüsse

Was ist eine "current-class"?
Klassen vergibt man in HTML, nicht im CSS-Code.

 

[HannemannMediaAG]

Wenn ein Punkt in der Navigation ausgewählt (aktiv) ist, dann hat er bei mir eine separate Klasse, wie z. B. diese: "main-navigation .current-menu-item".

 

[scbawik]

Wenn ein Punkt in der Navigation ausgewählt (aktiv) ist, dann hat er bei mir eine separate Klasse, wie z. B. diese: "main-navigation .current-menu-item".

So? Ich versteh die Frage nicht…

.main-navigation li ul li.current-menu-item a {
}

 

[HannemannMediaAG]

Das hat leider nicht funktionier. Ich sende Dir mal den Link zu der Seite. Wenn Du jetzt einen Punkt in der Navigation anklickst und nochmals das Menü aufklappst, dann soll der derzeit aktive Punkt z. B. einen roten border haben.

http://www.hannemann-media.ch/clients/ndof_wp

 

[HannemannMediaAG]

.main-navigation li ul li.current-menu-item a {
}

Das hat leider nicht funktioniert.

 

[Tronjer]

Der Screenshot bringt gar nichts. Stelle die Seite lieber online. Fehler untersucht man per Firebug.

 

[HannemannMediaAG]

Hast den Link auch gesehen?

 

[Tronjer]

Ah ok, hatte ich übersehen.

So sollte es funktionieren:

.nav-menu ul li ul li.current_page_item a { .... }

 

[HannemannMediaAG]

Super! Danke... es funktioniert.