JSFiddle - React, Tailwind, and code Playground

HTML

<nav>
	<ul>
		<li><a href="home.html">home</a></li>
    <li><a href="about.html">about</a></li>
    <li><a href="contact.html">contact</a></li>
    <li><a href="help.html">help</a></li>
    <li><a href="#">Contact</a></li>
	</ul>
</nav>

CSS

body{
    margin: 0;
    font: normal 12px verdana, tahoma;
    background-color: #acacac;
}
nav{
    display: block;
    background-color: #4679BD;
}
nav ul{
    margin: 0;
    padding: 0;
    list-style: none;
}
nav ul > li{ display: inline; }
nav ul > li > a{
    display: inline-block;
    padding: 15px 10px;
    border-right: #4072B4;
    text-decoration: none;
    color: #fff;
    text-transform: capitalize;
}
nav ul > li > a:hover{ background-color: #4072B4; }