<div class="grid-image-container">
  <img class="grid-image" src="https://ik.imagekit.io/demo/resp-img/image1.jpg" />
</div>
<div class="grid-image-container">
  <img class="grid-image" src="https://ik.imagekit.io/demo/resp-img/image2.jpg" />
</div>
<div class="grid-image-container">
  <img class="grid-image" src="https://ik.imagekit.io/demo/resp-img/image3.jpg" />
</div>
<div class="grid-image-container">
  <img class="grid-image" src="https://ik.imagekit.io/demo/resp-img/image4.jpg" />
</div>
<div class="grid-image-container">
  <img class="grid-image" src="https://ik.imagekit.io/demo/resp-img/image5.jpg" />
</div>
<div class="grid-image-container">
  <img class="grid-image" src="https://ik.imagekit.io/demo/resp-img/image6.jpg" />
</div>

body {
  font-size: 0;
}

.grid-image-container {
  width: 32%;
  display: inline-block;
  vertical-align: top;
  height: 200px;
  overflow: hidden;
  margin: 0 0.5% 1% 0.5%;
}

.grid-image {
  width: 100%;
  min-height: 200px;
}

@media(max-width: 720px) {
  .grid-image-container {
    width: 49%;
  }
}

@media(max-width: 480px) {
  .grid-image-container {
    width: 99%;
  }
}