<div class="container">
  <a href="#" class="item">
    <img src="https://res.cloudinary.com/code-kitchen/image/upload/c_lfill,w_1100/q_auto/v1582702766/posts/k6x0uh8l4bz2vtoqoqfe.jpg">
  </a>
  <a href="#" class="item">
    <img src="https://res.cloudinary.com/code-kitchen/image/upload/c_lfill,w_1100/q_auto/v1582702766/posts/jcxndso6jdqhon8fqvgl.jpg">
  </a>
  <a href="#" class="item">
    <img src="https://res.cloudinary.com/code-kitchen/image/upload/c_lfill,w_1100/q_auto/v1582702766/posts/x9wvdm7p41vmn65xwue2.jpg">
  </a>
  <a href="#" class="item">
    <img src="https://res.cloudinary.com/code-kitchen/image/upload/c_lfill,w_1100/q_auto/v1582702766/posts/ygvvvsr7eabhjyonrbeu.jpg">
  </a>
  <a href="#" class="item">
    <img src="https://res.cloudinary.com/code-kitchen/image/upload/c_lfill,w_1100/q_auto/v1582702766/posts/wobux0mirfyoyvns1jed.jpg">
  </a>
  <a href="#" class="item">
    <img src="https://res.cloudinary.com/code-kitchen/image/upload/c_lfill,w_1100/q_auto/v1582702766/posts/zhfbhbrzlhznrrsmwv5l.jpg">
  </a>
  <a href="#" class="item">
    <img src="https://res.cloudinary.com/code-kitchen/image/upload/c_lfill,w_1100/q_auto/v1582702766/posts/k6x0uh8l4bz2vtoqoqfe.jpg">
  </a>
  <a href="#" class="item">
    <img src="https://res.cloudinary.com/code-kitchen/image/upload/c_lfill,w_1100/q_auto/v1582698552/posts/fxcvhkiws6std1qiyc5o.jpg">
  </a>
  <a href="#" class="item">
    <img src="https://res.cloudinary.com/code-kitchen/image/upload/c_lfill,w_1100/q_auto/v1582702766/posts/k6x0uh8l4bz2vtoqoqfe.jpg">
  </a>
</div>

.container {
  max-width: 300px;
  margin: 1rem auto;
  display: flex; /* 横並び */
  flex-wrap: wrap; /* 折り返す */
}
.item {
  position: relative;
  width: 33.3%; /* 幅 */
  padding-bottom: 33.3%; /* 幅と同じ高さをつくる */
  border: solid 2px #FFF; /* 白の枠線 */
  box-sizing: border-box;
}
.item img {
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
}