JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">
  <a href="https://placeholder.com">
   <img src="http://via.placeholder.com/100x100">
    <p>
     Brian
    </p>
  </a>
  <a href="https://placeholder.com">
   <img src="http://via.placeholder.com/100x100">
   <p>
    Betsy 
   </p>
  </a>
  <a href="https://placeholder.com">
   <img src="http://via.placeholder.com/100x100">
   <p>
    Variable Length Names Go Here 
   </p>
  </a>
  <a href="https://placeholder.com">
   <img src="http://via.placeholder.com/100x100">
   <p>
    Alan 
   </p>
  </a>
  <a href="https://placeholder.com">
   <img src="http://via.placeholder.com/100x100">
   <p>
    Another variable length 
   </p>
  </a>
</div>

CSS

.container {
  display: flex;
  flex-wrap: wrap;
}

a {
  text-align: center;
  padding: 25px;
  flex: 1 1 0;
}