Menüleiste mit Trennlinien versehen

Hallo,

ich könnte mal eure Hilfe gebrauchen, denn ich verzweifel leider ein wenig mit meinen nicht gerade ausgeprägten Programmierkenntnissen. Ich möchte gerne das die Menü- / Kategorieleiste meines Shops mit Trennlinien versehen, exakt wie auf dieser Seite https://www.mister-2rad.de , nur halt mit eigenen Farben. Kann mir jemand weiterhelfen und sagen, wie das funktioniert?

Ich freue mich auf eure Antworten!

Herzliche Grüße aus Oldenburg,
Matthias Wempe

 

Hallo Matthias

willkommen im Forum.

Bei Mister 2-Rad sieht der Code an dieser Stelle so aus:

Code:

#head_navi ul li {
    border-right: 1px solid #cecece;
    display: inline;
    float: left;
    padding: 0 0 0 0;
    height: 50px;
}

Für die Trennlinien ist das "border-right" verantwortlich.

Versuche doch mal das hier als eigenes CSS im Styleedit einzugeben:

Code:

#head_navi ul li {
    border-right: 1px solid #cecece;
}

Caches leeren nicht vergessen. Das #cecece kannst Du natürlich auf Deine Wunschfarbe ändern.

 

Hallo Achim,

vielen Dank für deine schnelle Unterstützung. Den CSS Code habe ich wie beschrieben eingegeben. Die Höhe hat sich im Menü verändert, auch der Text ist wunderbar zentriert, allerdings zeigt er die Trennlinien noch nicht an. Ich habe auch versucht, den Code von oben einzugeben. Auch dies funktioniert leider nicht. Weißt du vll. woran das liegen könnte?

LG, Matthias

 

Link zum Shop?

 

Tipp: wenn Du im Chrome-Browser mit der rechten Maustaste auf den Bereich klickst und dann auf "untersuchen" klickst, bekommst Du den CSS-Code angezeigt und kannst ihn dort auch testweise ändern.

Sieht so aus:
Bild 1 ist der angezeigt Code
Bild 2 ist die Optik wenn man den border-Code deaktiviert

 

Moin Moin
Hat hier jemand vielleicht noch ne Idee wie man die Trennlinien realisiert? Irgendwo scheint ein Haken zu sein...

 

Code:

.navbar-categories > ul > li {
    border-right: 1px solid #DeineFarbe;
}

sollte funktionieren

 

Ja cool, der ging nun, DANKE