XHTMLforum - Ol mit korrekter Nummerierung in zweiter Ebene

XHTMLforum (http://xhtmlforum.de/index.php)

- (X)HTML (http://xhtmlforum.de/forumdisplay.php?f=72)

- - Ol mit korrekter Nummerierung in zweiter Ebene (http://xhtmlforum.de/showthread.php?t=74128)

Ol mit korrekter Nummerierung in zweiter Ebene

Hallo, ich finde nicht, wie man einer Liste beibringt, dass sie bei der Nummerierung den Oberpunkt mit anzeigt - so:

1.erster Punkt
1.1. erste Unterpunkt von 1
1.2. zweiter Unterpunkt von 1

2.zweiter Punkt
2.1. erster Unterpunkt von 2
2.2. zweiter Unterpunkt von 2

Ich schaffe es nur, dass bei den Unterpunkten immer wieder nur bei 1 angefangen wird

1.erster Punkt
1. erste Unterpunkt von 1
2. zweiter Unterpunkt von 1

2.zweiter Punkt
1. erster Unterpunkt von 2
2. zweiter Unterpunkt von 2

Vielen Dank für eure Hilfe!
Irmen

Das kannst du zum Beispiel mit Pseudo-Elementen und Countern lösen:

Code:

ol {

        list-style: none;

        counter-reset: outer;

}

ol > li::before {

        counter-increment: outer;

        content: counter(outer)'.';

        padding-right: .25em;

}

ol li ol {

        counter-reset: inner;

}

ol ol li::before {

        counter-increment: inner;

        content: counter(outer)'.'counters(inner, '.');

        padding-right: .25em;

}

Vielen Dank für die Hilfe!!
Ich konnte das jetzt so ähnlich umsetzen.

Woran ich leider wieder scheitere ist, dass ich es nicht schaffe, die Nummerierung VOR den Text zu setzen, so wie ich es aus list-style-position kenne. Das scheint aber nur für <ul> zu funktionieren. Wie geht das bei <ol> - verzeihung, wenn ich total auf dem Schlauch sitze - ich finde es nicht ...

sieht jetzt so aus:

1.erster Punkt
1. erste Unterpunkt von 1 - mit text
blal bal weiteret Texte
2. zweiter Unterpunkt von 1
mit text
blal bal weiteret Texte

2.zweiter Punkt
1. erster Unterpunkt von 2mit text
blal bal weiteret Texte
2. zweiter Unterpunkt von 2mit text
blal bal weiteret Texte

soll aber so aussehen - Ohne die Striche - die stellen den Abstand dar:

1. erster Punkt
-1. erste Unterpunkt von 1 - mit text
----blal bal weiteret Texte
-2. zweiter Unterpunkt von 1
----mit text
----blal bal weiteret Texte

2.zweiter Punkt
-1. erster Unterpunkt von 2mit text
----blal bal weiteret Texte
-2. zweiter Unterpunkt von 2mit text
----blal bal weiteret Texte

Hier das css:

Zitat:

div.agb2 div.wpb_wrapper ol {
counter-reset: section;
padding-left: 10px;
}
li {
display: block;
padding-left:10px;
text-align:left;
}
div.agb2 div.wpb_wrapper li::before {

content: counters(section, ".") ". ";
counter-increment: section;
padding-left: 20px;
color:red;
}

so ist die Liste aufgebaut:

Zitat:

vielen Dank für eure Hilfe!
Irmen

Dein HTML hat leider nicht die Klassen die du im CSS angegeben hast. Auch fehlt der Text.

Eigentlich müsste es reichen die li auf display flex zu setzen.

@cloned, danke für den Hinweis - aber die Klassen werden schon richtig ausgelesen, daran liegt es nicht. Ich habe die umgebenden divs nicht extra nochmal hingeshrieben, weil es mir nicht relvant erschien.
@ inta - DANKE! Das war zielführend!
Ich frage mich nun: normalerweise, ist das doch der "Normalzustand", oder? (dass die Nummerierung außerhalb der li steht) wird das - ich verwende ein Wordpresstheme - in diesem Theme vielleicht irgendwo anders definiert? Ich habe keine entsprechende Stelle gefunden.
Vielen Dank für die Unterstützung!
Irmen

Die list items (https://developer.mozilla.org/de/doc...st-style-image list-style-image zb) sitzen per default außerhalb, das stimmt schon.
Du baust aber deine eigene Aufzählung, da musst du auch das von dir gewünschte Styling umsetzen. Der Browser weiß ja nicht, dass deine händisch eingesetzten Elemente eigentlich Aufzählungen sind.

ok - vielen Dank!
Ich dachte, das erkennt er an Hand von ol und ul und li
Danke!