zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > (X)HTML
Seite neu laden Ol mit korrekter Nummerierung in zweiter Ebene

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 27.08.2020, 17:49
Erfahrener Benutzer
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 11.03.2011
Beiträge: 327
irmen befindet sich auf einem aufstrebenden Ast
Standard 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
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 27.08.2020, 20:57
Benutzerbild von inta
free as in freedom
XHTMLforum-Kenner
 
Registriert seit: 04.12.2006
Ort: Berlin
Beiträge: 5.027
inta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz sein
Standard

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;
}
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 03.09.2020, 10:59
Erfahrener Benutzer
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 11.03.2011
Beiträge: 327
irmen befindet sich auf einem aufstrebenden Ast
Standard

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:
<ol>
<li>
<ol>
<li></li>
<li></li>
<li></li>
</ol>
</li>
<li>
<ol>
<li></li>
<li></li>
<li></li>
</ol>
</li>
</ol>
vielen Dank für eure Hilfe!
Irmen

Geändert von irmen (03.09.2020 um 11:05 Uhr)
Mit Zitat antworten
  #4 (permalink)  
Alt 09.09.2020, 10:32
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 30.01.2014
Beiträge: 2.074
cloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekannt
Standard

Dein HTML hat leider nicht die Klassen die du im CSS angegeben hast. Auch fehlt der Text.
Mit Zitat antworten
  #5 (permalink)  
Alt 09.09.2020, 15:29
Benutzerbild von inta
free as in freedom
XHTMLforum-Kenner
 
Registriert seit: 04.12.2006
Ort: Berlin
Beiträge: 5.027
inta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz sein
Standard

Eigentlich müsste es reichen die li auf display flex zu setzen.
Mit Zitat antworten
  #6 (permalink)  
Alt 10.09.2020, 09:33
Erfahrener Benutzer
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 11.03.2011
Beiträge: 327
irmen befindet sich auf einem aufstrebenden Ast
Standard

@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
Mit Zitat antworten
  #7 (permalink)  
Alt 10.09.2020, 10:57
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 30.01.2014
Beiträge: 2.074
cloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekannt
Standard

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.
Mit Zitat antworten
  #8 (permalink)  
Alt 10.09.2020, 14:24
Erfahrener Benutzer
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 11.03.2011
Beiträge: 327
irmen befindet sich auf einem aufstrebenden Ast
Standard

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

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Verschachtelte Listen mit Nummerierung gabischatz (X)HTML 12 06.01.2014 16:22
Dropdown Navigation - 2. Ebene ein-/ausblenden img CSS 7 17.12.2010 00:02
Listennavigation - Ausrichtung der dritten Ebene Unwritten CSS 2 08.11.2010 16:09
Probleme mit einem CSS-Menü (UL-Liste)! hagbard_2605 CSS 0 21.10.2006 11:03
Ebene "undurchsichtig" machen diver CSS 1 19.10.2006 11:52


Alle Zeitangaben in WEZ +2. Es ist jetzt 20:19 Uhr.