JSFiddle - React, Tailwind, and code Playground

HTML

<div class="nav">
    <ul>
        <li>item1</li>
        <li>item2</li>
        <li>item3</li>
        <li>item4</li>
        <li>item5</li>
        <li>item6</li>
        <li>item7</li>
        <li>item8</li>
    </ul>
</div>

CSS

div {
    background-color: #FF8181;
    color: #FFF;
    padding: 10px 0;
}
ul {
    padding: 0;
    margin: 0;
    list-style: none;
    display: table;
    width: 100%;
    text-align: center;
}
li {
    display: table-cell;
    border-left: 1px solid;
}
li:first-child {
    border-left: none;
}