JSFiddle - React, Tailwind, and code Playground

HTML

<ul id="nav">            
    <li><a href="#">Lorem ipsum dolor</a></li>            
    <li><a href="#">ipsum</a></li>           
    <li><a href="#">dolor</a></li>           
    <li><a href="#">sit</a></li>            
    <li><a href="#">amet</a></li>     
    <li id="last"><!-- --></li>        
</ul>

CSS

* {
  padding: 0;
  margin: 0;
}
ul {
  list-style-type: none;
}
a{
  text-decoration: none;
}
#nav a:link,
#nav a:visited {
  color: #ccc;
}
#nav a:hover {
  color: #fff;
}
#nav  {
  text-align: justify;
  background: #171717;
  height: 2em;
  line-height: 2em;
}
#nav li {
  display: inline-block;
}
#nav li#last {
  padding-left: 100%;
}