JSFiddle - React, Tailwind, and code Playground
HTML
<div class="headercontainer">
<header>
<ul>
<li>Home</li>
<li>Serviços</li>
<li>Trabalhos</li>
<li>Contato</li>
</ul>
</header>
</div>
CSS
.headercontainer {
position:fixed;
height:80px;
width:500px;
background-color:#f5f5f5;
}
.headercontainer header {
padding:0 10px 0 10px;
height:inherit;
}
.headercontainer ul {
list-style:none;
word-spacing:20px;
border:1px solid black;
padding:0px;
margin:0px;
width:300px;
float:right;
height:inherit;
}
.headercontainer li {
position: relative;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
display:inline-block;
}