JSFiddle - React, Tailwind, and code Playground

HTML

<ul id="list-nav">            
    <li><a href="home.html">HOME</a></li>            
    <li><a href="about.html">ABOUT</a></li>           
    <li><a href="trailer.html">TRAILER</a></li>           
    <li><a href="stills.html">STILLS</a></li>            
    <li><a href="news.html">NEWS</a></li>            
    <li><a href="contact.html">CONTACT</a></li>          
    <li id="last"><!-- --></li>        
</ul>

CSS

ul#list-nav { 
  text-align: justify;
  width: 100%;
}
ul#list-nav li { 
    display: inline;
    padding: 5px;
}
ul#list-nav li#last { display: inline-block /* Opera */; padding-left: 100%; }