JSFiddle - React, Tailwind, and code Playground

HTML

<div id="wrapper">
    <div class="post">
        <ol>
            <li>El contenido del 1er. elemento</li>
            <li>El contenido del 2do. elemento</li>
            <li>El contenido del 3er. elemento</li>
            <li>El contenido del 4to. elemento</li>
      </ol>
    </div> 
</div>

CSS

.post-outer ol{
 margin-left:0;
 padding-left:0
}
.post ol li{
 position:relative;     
 margin:0 0 20px 2em !important;
 padding:4px 8px !important;
 list-style:none;
 *list-style: decimal;
    counter-increment:li;
}
.post ol li:before{
 
 content:counter(li);
 position:absolute;
 top:-8px;
 left:-39px;
 font-family:'Oswald', serif;
 font-size:40px; /*tamaño de la fuente*/
 width:34px;
 margin:0 0 10px 0;
 padding:4px !important;
 color:#000;
 text-align:center;
}