JSFiddle - React, Tailwind, and code Playground

by swfour

HTML

<div class="navbar navbar-default navbar-static-top header-menu">
    <div class="collapse navbar-collapse navHeaderMenuCollapse">
        <ul class="nav navbar-nav navbar-middle navbar-text" style="float:none;margin: 0 auto; display: table;table-layout: fixed;">
            <li><a href="#">HOME</a>

            </li>
            <li><a href="#">AUTO</a>

            </li>
            <li><a href="#">LIFE</a>

            </li>
            <li><a href="#">HEALTH</a>

            </li>
            <li><a href="#">BUSINESS</a>

            </li>
            <li><a href="#">MORE...</a>

            </li>
        </ul>
    </div>
</div>

CSS

ul li {
    float: left;
}
ul li:not(:last-child) {
    border-right:1px solid grey;
    margin-right:20px;
    padding-right:20px;
}