[GELÖST] ONEPAGE - Unterstrich-Design in Headern ändern

andreasjell
Autor
Neues Mitglied
Beiträge: 12
Dank erhalten: 1

[GELÖST] ONEPAGE - Unterstrich-Design in Headern ändern wurde erstellt von andreasjell

Posted 10 Monate 4 Wochen her #1

Für den Border, also den Unterstrich, gibt es 3 Definitionen mit 30%,40%und 50%, die sich allerdings auf die Containerbreite beziehen:

headline-border-30
headline-border-40
headline-border-50

Diese sind als Style im jeweiligen Container im Layout eingetragen.

Ich habe daraus einen Style gebaut, der den Border immer so breit macht, wie der Text lang ist:

Code:

/* Headlines Border 00*/
.headline-border-00 .module-title {
    position: relative;
    padding-bottom: 0.9rem;
    display: inline-block;
    margin: 0 0 1.4em;
    padding: 0 0em 0.4em 0;
}
.headline-border-00 .module-title::after {
    bottom: 0;
    content: "";
    height: 3px;
    left: 0;
    position: absolute;
    width: 100%;
    background-color: var(--bs-primary);
    border: none;
}

Mit der Padding-Anweisung kann der Unterstrich auch länger oder kürzer gemacht werden, aber immer im Bezug zur Textlänge.

Danke und viele Grüße
Andreas

Last Edit:10 Monate 4 Wochen her von andreasjell

Letzte Änderung: 10 Monate 4 Wochen her von andreasjell.

Dieses Thema wurde gesperrt.

Powered by Kunena Forum

Installations-Service

Sparen Sie Zeit, wir installieren ihr gekauftes Joomla Template
mit all den dazugehörigen Extensions und dem "Demo Inhalt" innerhalb der nächsten 24 Stunden
auf einem Server/Webhost ihrer Wahl

[GELÖST] ONEPAGE - Unterstrich-Design in Headern ändern

[GELÖST] ONEPAGE - Unterstrich-Design in Headern ändern wurde erstellt von andreasjell

Installations-Service

Über uns

Support & FAQ

Dokumentation ( Extern)