JSFiddle - React, Tailwind, and code Playground

HTML

<ul>
   <li><a href="#">step 1 (big)</a></li>
   <li><a href="#">step 2</a></li>
   <li><a href="#">step 3 (super big)</a></li>
   <li><a href="#">step 4</a></li>
</ul>

CSS

*{margin:0; padding:0;}
body {
    font:13px/120% Arial;
    padding:5px;
}
ul {
    line-height:0;
    font-size:1px;
    text-align:justify;
    text-justify:newspaper;
    text-align-last:justify;
    zoom:1;
}
ul:after {
    content: "";
    display: inline-block;
    height: 0;
    overflow: hidden;
    visibility: hidden;
    width: 100%;
}
li {
    display:inline-block;
    //display:inline;
    //zoom:1;
    vertical-align:top;
    background:#eee;
    padding:5px;
    margin:2px 0;
    line-height:normal;
    font-size:13px;
    text-align:left;
}