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/100% Arial;
    padding:5px;
}
ul {
    display:table; 
    width:100%; 
    text-align:center;
    border-spacing:2px;
}
li {
    display:table-cell;
    background:#eee;
    padding:5px;
}