JSFiddle - React, Tailwind, and code Playground

HTML

<section class="gallery-links">
  <img class="gallery-img" src="https://www.w3schools.com/howto/img_forest.jpg" alt="img1">
  <img class="gallery-img" src="https://www.w3schools.com/howto/img_forest.jpg" alt="img2">
  <img class="gallery-img" src="https://www.w3schools.com/howto/img_forest.jpg" alt="img3">
  <img class="gallery-img" src="https://www.w3schools.com/howto/img_forest.jpg" alt="img4">      
</section>

CSS

.gallery-links{
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  /*justify-content: flex-start;*/
  align-items: center;
}
.gallery-img{
    flex-basis: 300px;
    margin: 10px;
}
.gallery-img img{
  width: 100%;
}