Überschriften in einem ol, Einrückung linken oder negativen Text-Einrückung

Question

Ich versuche, die Überschrift auf der linken Seite des Listenelements zu haben.
Ich möchte nicht eine geordnete Liste innerhalb einer ungeordneten verschachteln, weil ich die Listenelemente zwischen den Überschriften kontinuierlich sein müssen.

Dies ist, was ich verwendet habe, aber ich mag es nicht, dass die Überschrift richtig eingerückt ist, obwohl sie nicht im Listenelement enthalten ist.

Versucht mit "text-indent: -2em" auf die Überschrift, aber das hat nicht funktioniert. Ich habe sogar versucht, ein separates div zu erstellen und dort den negativen Texteinzug zu setzen, aber das hat auch nicht funktioniert.

<ol reversed> 
 
    <h3>year</h3> 
 
    <li>item</li> 
 
    <li>item</li> 
 
    <h3>year</h3> 
 
    <li>item</li> 
 
</ol>

versucht, ein paar Webseite: https://www.htmlgoodies.com/tutorials/getting_started/article.php/3479461

Answer 1

Also, ich glaube, Sie auf dem richtigen Weg sind mit dem -2em den Einzug rückgängig zu machen, aber es muss platziert werden "margin-left" anstelle von "text-indent", und erstellen Sie entweder eine Klasse, um sie jedes Mal aufzurufen, wenn Sie sie verwenden möchten:

in CSS:

.unindent{ 
    margin-left: -2em; 
} 

HTML:

<ol reversed> 
    <h3 class="unindent">year</h3> 
    <li >item 1</li> 
    <li>item 2</li> 
    <h3 class="unindent">year</h3> 
    <li>item 3</li> 
</ol> 

oder individuell fügen Sie die Zeilen, die Sie "un gegliederte" wollen:

<ol reversed> 
     <h3 style="margin-left: -2em" >year</h3> 
     <li >item 1</li> 
     <li>item 2</li> 
     <h3 style="margin-left: -2em" >year</h3> 
     <li>item 3</li> 
    </ol> 

kann es andere Wege geben, aber das ist der einfachste Weg, ich könnte Denk an. Viel Glück!