JSFiddle - React, Tailwind, and code Playground

HTML

<div style="background-color:#34495e;display:flex; justify-content:center;">
  <div class="flx-search">
     <a class="flx-search-item">Search Our Catalog</a>
     <a class="flx-search-item">View Patron Record</a>
     <a class="flx-search-item">Register for Programs</a>  
  </div>
</div>

CSS

.flx-search {
  display:flex;
  flex-direction: row;
  flex-wrap:wrap;
  justify-content: center;
  align-items:center;
  
  
  width:1060px;
  color:#ffffff;
}

.flx-search-item {
  flex-grow:1;
  text-align:center;
  display:block;
  flex: 0 0 350px;
  height:50px;
}