JSFiddle - React, Tailwind, and code Playground

HTML

<nav>
    <ul>
        <li><a href="">HOME</a></li>
        <li><a href="">GUIDES</a></li>
        <li><a href="">FORUM</a></li>
        <li><a href="">BLOG</a></li>
    </ul>
</nav>

CSS

nav{
    
}
ul{
    /*Reset margin and padding of ul*/
    margin:0;
    padding:0;
    
    /*Give fixed width needed for centering*/
    width:200px;
    
    /*Center the list*/
    margin:0 auto;
    
    /*Background to show what's centered*/
    background:#999;
    
    /*Center text if you really want things centered as much as possible*/
    text-align:center;
}
li{
    display:block;
}