Ergebnis 1 bis 4 von 4

Thema: Aufzählungspunkte einer geodneten Liste in Klammern setzen

  1. #1
    Contao-Fan
    Registriert seit
    31.01.2016.
    Ort
    Kaufbeuren
    Beiträge
    473

    Standard Aufzählungspunkte einer geodneten Liste in Klammern setzen

    Hallo zusammen,

    ich möchte die Aufzählungspunkte einer geordneten Liste OL als Zahl in einer Klammern darstellen (1), (2), (3) usw.
    Eine Möglichkeit habe ich zwar dafür gefunden, aber wenn der Text einer Zeile zu lange ist und umbricht dann steht nach dem Umbruch der Text unter der Zahl. Mit list-style-type kann man es wohl nicht realisieren?

    Ausgabe Webseite
    Code:
    (1) Text ...
    (2) Text ...
    Text ...
    (3) Text ...
    CSS-Code
    Code:
    ol {
    counter-reset:list;
    }
    
    li {
    list-style:none;
    }
    
    li::before {
    content:"(" counter(list, decimal) ") ";
    counter-increment:list;
    }
    Gibt es dafür eine Lösung, damit der Text nach dem Umbruch nicht unter der Zahl steht, sondern an der gleichen Position wie die anderen Texte beginnt.
    Danke!

    Gruß
    Thomas

  2. #2
    AG Pressearbeit
    Community-Moderator
    Buchautor 'Contao für Webdesigner'
    Avatar von planepix
    Registriert seit
    05.06.2009.
    Ort
    Stuttgart
    Beiträge
    6.569
    Partner-ID
    107
    Contao-Projekt unterstützen

    Support Contao

    Standard

    Guten Abend Thomas,

    mit der Eigenschaft list-style-position kann man das beeinflussen.

    http://www.css4you.de/list-style-position.html
    ---------------------------------
    Beste Grüße planepix
    Contao für Webdesigner (Website), BlueSky: planepix
    weitzeldesign
    Contao-Sprechstunde
    Contao Schulungen: https://www.weitzeldesign.com/cms-co...chulungen.html
    Contao Jahrbuch: www.contao-jahrbuch.de
    Contao Agenturtag: www.contao-agenturtag.de
    Contao Stammtisch Stuttgart: www.contao-stammtisch-stuttgart.de

    Glücklich sind die, die den Wert erkennen – und wertschätzen.

  3. #3
    Contao-Fan Avatar von rusty
    Registriert seit
    07.02.2012.
    Ort
    Hamburg
    Beiträge
    270

    Standard

    Ich würde dem li ein padding-left geben und das li::before absolut positionieren sowie einen negativen margin-left festlegen.

  4. #4
    Contao-Fan Avatar von mdoll
    Registriert seit
    25.06.2009.
    Ort
    Wietze
    Beiträge
    358

    Standard

    Moin,

    guck mal hier:

    http://jsfiddle.net/nKtE6/2/

    CSS, Zeile 18 ist in dem Beispiel:
    Code:
    content: counter(list, lower-alpha) ") ";
    mit
    Code:
    content: "(" counter(list, decimal) ") ";
    bekommt man, was Du möchtest.

    Ich weiß aber nicht, wie da die Browserunterstützung ist.

    Gruß
    Mathias
    The idea is to die young as late as possible!

Aktive Benutzer

Aktive Benutzer

Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1)

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •