JSFiddle - React, Tailwind, and code Playground

HTML

<ol>

<li>me the first point
<ol><li>me the sub point</li></ol>

</li>
<li>me the second point</li>
<li>me the third point</li>
<li>me the forth point</li>


</ol>

CSS

body{
   counter-reset: chapter 0;
 }
 li{
   counter-reset: sub-chapter 0;
    margin-left:20px;
    position:relative;
 }
 li:before{
   counter-increment: chapter;
   content: counter(chapter) ". ";
 }
 li li:before{
   counter-increment: sub-chapter;
   content: counter(chapter) "." counter(sub-chapter) ": ";
 }
li:before{
    position:absolute;
    left:-20px;
}