JSFiddle - React, Tailwind, and code Playground

by kiokotzu

HTML

<nav class="container">
  <ul class="list-centered">
    <li><a href="#">Hello, this is</a></li>
    <li><a href="#">a centered</a></li>
    <li><a href="#">navigation menu</a></li>
    <li><a href="#">using ul li elements</a></li>
  </ul>     
</nav>

CSS

nav.container {max-width:inherit;}ul.list-centered{margin:0 auto;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;display:table\0/!important;
}ul.list-centered li{float:left;margin:0 .5em;line-height:2.188em; list-style:none;}
nav ul li{background:blue; margin:0 5px; padding:0 5px;}
nav ul li a{color:#fff;}