JSFiddle - React, Tailwind, and code Playground

HTML

<div>
        <span><a href="">первый</a></span>
        <span><a href="">второй</a></span>
        <span><a href="">третий</a></span>
        <span><a href="">четвертый большой</a></span>
        <span><a href="">пятый</a></span>
    </div>

CSS

body{
margin:0;
background:#ccc;
}

div{
display:table;
width:100%;
}

span{
display:table-cell;
width:20%;
font-size:18px;
text-align:center;
vertical-align:middle;
border-left:1px solid #222;
text-shadow:0px 1px #f7f7f7;
}
span:first-child{
text-align:left;
border:none;
width:15%;
}

a{
color:#222;
text-decoration:none;
}

a:hover{
color:#b84d4d;
}