JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrapper">
<div class="topmenu">
<a href="">Home</a> | <a href="">Service</a>
    <a href="">Home</a> | <a href="">Service</a><a href="">Home</a> | <a href="">Service</a><a href="">Home</a> | <a href="">Service</a>
    
    </div>
</div>

CSS

.wrapper {background:#ccc;
height: 500px
}
.topmenu {background:#aaa;
text-align:center;
}

.topmenu a{
display:inline-block;
}