JSFiddle - React, Tailwind, and code Playground

by Akkuma

HTML

<ol>
    <li>
        <a href="#">
            <label>Applicants<span>1</span></label>            
        </a>
    </li>
    <li>
        <a href="#">
            <label>Candidates<span>2</span></label>
        </a>
    </li>
    <li>
        <a href="#">
            <label>Hires<span>23</span></label>
        </a>
    </li>
</ol>

CSS

ol {
    letter-spacing: -.25em;
    word-spacing: -1em;
}

ol li {
    display: inline-block;
    *display: inline;
    zoom: 1;
    letter-spacing: normal;
    word-spacing: normal;
    vertical-align: top;
}

label { 
    display: inline-block;
    *display: inline;
    zoom: 1;
    vertical-align: middle;
    border-right: 1px solid black;
}

span {
    text-align: center;
    display: inline-block;
    *display: inline;
    zoom: 1;
    width: 42px;
    height 24px;
    vertical-align: middle;
}