JSFiddle - React, Tailwind, and code Playground

HTML

<nav>
           <ul class="menu">
            <li><a href="about.html">About Us</a></li>
            <li><a href="services.html">Services</a></li>
            <li><a href="index.html"><img alt="Eni Gma" src="images/logo.png"></a></li>
            <li><a href="index-3.html">Gallery</a></li>
           <li><a href="index-4.html">Contacts</a></li>
          </ul>
</nav>

CSS

nav {
    padding:12px 0 0 0;
    overflow: auto;
    text-align: center;
}

nav ul {
    display: inline-block;
    margin: 0 auto;
}

nav ul li {
    list-style-type: none;
    float: left;
}