JSFiddle - React, Tailwind, and code Playground

HTML

<ul id="nav-menu">
    <li class="current_page_item"><a href="http://www.ryanjake.co.uk/" title="Home">Home</a></li>
    <li class="current_page_item"><a href="http://www.ryanjake.co.uk/" title="Home">Home</a></li>
    <li class="current_page_item"><a href="http://www.ryanjake.co.uk/" title="Home">Home</a></li>
    <li class="current_page_item"><a href="http://www.ryanjake.co.uk/" title="Home">zxczczxczHome</a></li>
</ul>

CSS

#nav-menu{
    font-family: Verdana, Arial, Helvetica, sans-serif;
    height: 30px;
    background-image: url(../img/menu_bg.png);
    background-repeat:repeat-x;
    border-bottom:dotted thin #666666;
    border-top:dotted thin #666666;
   
    width:800px;
}

#nav-menu ul
{
    list-style: none;
    padding: 0;
    margin: auto 0;
}

#nav-menu li
{
    display: inline-block;
    border-right:dotted thin #666666;
    list-style: none;
    padding: 0.5em 2em 0.5em 2em;
    
}

#nav-menu li a
{
    line-height:1.5em;
    color: #333333;
    text-decoration: none;
    font-size: 12px;
    font-weight: bold;
    display: block;
    
}