JSFiddle - React, Tailwind, and code Playground

HTML

<ul class="nav">
  <li><a href="">Divisions & Services</a></li>
  <li><a href="">Projects</a></li>
  <li><a href="">About</a></li>
  <li><a href="">Careers</a></li>
  <li>C<a href="">ontact Us</a></li>
</ul>

CSS

*{
padding:0;
margin:0;
box-sizing:border-box;
}

.nav {
  list-style-type: none;
  display: flex;
  width: 100%;
  justify-content: flex-start;
  align-items:flex-start;
  padding:22px 0px
}

.nav li{
width:calc(100% / 5);
display:flex;
justify-content:center;
align-items:center;
}

li:hover {
  font-weight: bold;
}