JSFiddle - React, Tailwind, and code Playground

by alexche8

HTML

<ol>
    <li>first</li>
    <li>second
        <ol class="nested-2">
            <li>second nested first element</li>
            <li>second nested secondelement</li>
            <li>second nested thirdelement</li>
        </ol>
    </li>
    <li>third</li>
    <li>fourth</li>
</ol>

CSS

.nested-1 {
  counter-reset: nested-1;
}

.nested-1 > li {
  list-style-type: none;
}

.nested-1 > li:before {
  counter-increment: nested-1;
  content: '1.' counter(nested-1) " ";
}


.nested-2 {
  counter-reset: nested-2;
}

.nested-2 > li {
  list-style-type: none;
}

.nested-2 > li:before {
  counter-increment: nested-2;
  content: '2.' counter(nested-2) " ";
}