<div class="wrapper">
  <div class="item">
    <div class="logo"></div>
  </div>
  <div class="item">
    <div class="logo"></div>
  </div>
  <div class="item">
    <div class="logo"></div>
  </div>
  <div class="item">
    <div class="logo"></div>
  </div>
  <div class="item">
    <div class="logo"></div>
  </div>
  <div class="item">
    <div class="logo"></div>
  </div>
  <div class="item">
    <div class="logo"></div>
  </div>
</div>
* {
  box-sizing: border-box;
}
.wrapper {
  max-width: calc(7 * 100px);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(auto-fit, 100px);
  justify-content: center;
}

.item {
  width: 100px;
  height: 100px;
  padding: 5px;
}

.logo {
  width: 100%;
  height: 100%;
  background: #424ef5;
}
View Compiled

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.