Lesefortschritt:

    Silbentrennung auf der Website aktivieren

    27. August 2025 | CSS-Stylesheet, Word­Press

    Trick # 489 | Dieser Beitrag beinhaltet 386 Wörter. – Geschätzte Lesezeit: ca. 2 Minuten.

    Heute mal wieder ein Hack, der überall funktioniert: Die automatische Silbentrennung. Dank eines simplen  CSS-Codes geht das auf allen Websites ganz einfach.

    Allerdings muss für eine korrekte Trennung auch die Sprachangabe im Dokument verewigt sein. Das wäre dann bei deutschsprachigen Seiten die Angabe <html lang="de-DE"> oder <html lang="de">.

    Fügen Sie dem CSS-Stylesheet folgenden Code hinzu, klappt das mit der Silbentrennung recht gut. In Word­Press legen Sie den Block im Backend unter Design/Customizer/Zusätzliches CSS ab:

    h1, h2, h3, h4, h5, h6, p {
    -moz-hyphens: auto;
    -o-hyphens: auto;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
    }

    In dieser Version wird die Silbentrennung bei allen Titeln (h1-h6) und in allen Paragraphen (p) aktiviert. Es sind natürlich noch andere Elemente, auch IDs und Klassen möglich. Einfach anpassen – und schon funktioniert’s.

    Wenn Sie z.B. in allen Elementen eine Silbentrennung möchten, geht das ganz einfach mit dem Asterisk (*). In diesem Fall einfach statt des obigen den folgenden Code in das CSS-Stylesheet unter Design/Customizer/Zusätzliches CSS einfügen:

    * {
    -moz-hyphens: auto;
    -o-hyphens: auto;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
    }

    So einfach.

    Werbung

    Keine Inhalte gefunden.

    Werbung

     

    Pin It on Pinterest

    Share This