JSFiddle - React, Tailwind, and code Playground
HTML
<ol class="progress">
<li><span>Lorem ipsum dolordolordolordolordolordolordolor dolordolordo lordolordolor sit amet, consectetur adipiscing elit.</span></li>
<li><span>Lorem ipsum dolordolordolordolordolordolordolor dolordolordo lordolordolor sit amet, consectetur adipiscing elit.</span></li>
<li><span>Lorem ipsum dolordolordolordolordolordolordolor dolordolordo lordolordolor sit amet, consectetur adipiscing elit.</span></li>
</ol>
CSS
*, *:after, *:before {
margin: 0;
padding: 0;
box-sizing: border-box;
font-family:"Open Sans";
}
ol {
counter-reset: numList;
}
li:before {
content: '';
display: inline-block;
width: 40px;
height: 40px;
background: #FFF;
border: 1px solid #d5d5da;
border-radius: 50%;
position: absolute;
left: 0;
}
li:after {
content: '';
display: inline-block;
width: 30px;
height: 30px;
line-height: 30px;
background: #8bc435;
border-radius: 50%;
position: relative;
margin-left: -45px;
margin-top: 5px;
float: left;
counter-increment: numList;
content: counter(numList);
color: #FFF;
text-align: center;
}
li {
line-height: 40px;
padding-left: 50px;
}
li span {
display: inline-block;
}