Trennzeichen für die Navigation

    Hallo,
    ich habe meine Seiten nebeneinander angeordnet. Nun möchte ich sie gerne mit diesem | (Trennzeichen) voneinander trennen. Wie ist das machbar?

    Gruß

    Current Work: Erstellen meines ersten WordpressTheme

    • Gerade eben
    • Anzeige

    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

    Zitat von marX

    Besser wäre es, hier mit Rahmen (CSS) zu arbeiten.


    Ja ok, verstehe ich. Leider bekomme ich es mit der Lösung nicht korrekt hin. Meine Navigation sieht wie folgt aus:

    PHP
    <ul>
  <li>
    <a href="<?php bloginfo('url'); ?>" title="Blog" target="_self">Blog</a>
  </li>
     <?php wp_list_pages('depth=1&title_li='); ?>
</ul>


    Wenn ich nun einfach mit border-right arbeite, bekommt ja auch die letzte Seite einen Rahmen, obwohl sie den nicht braucht. Gleiches gilt für padding-right bzw. padding-left.

    Current Work: Erstellen meines ersten WordpressTheme

    Zitat von marX

    Ich würde den Rahmen links setzen. Dein erstes <li> (Home) bekommt dann keinen Rahmen (da hast du ja verschiedene Möglichkeiten). Selbiges gilt für's Padding.


    Wenn ich den Rahmen links setze,

    Code
    #navigation-left li {
                float: left;
                font-size: 1.2em;
                letter-spacing: 2px;
                border-left: 1px groove #B1B1B1; }


    bekommt die erste Seite aber auch einen Rahmen links und das soll ja nicht sein...

    Current Work: Erstellen meines ersten WordpressTheme

    Entweder das. Ich würde aber eine Variante ohne zusätzliches Markup bevorzugen:

    • Entweder arbeitest du mit der Pseudoklasse :first-child.
    • Oder du verschiebst alle <li> relativ um $Rahmenbreite Pixel nach links.


    So, jetzt hast du 3 Möglichkeiten. Wähle weise! :mrgreen:

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!

Benutzerkonto erstellen Anmelden