<div class="list">
<div class="item">test1</div>
<div class="item">test2</div>
<div class="item">test3</div>
<div class="item">test4</div>
<div class="item">test5</div>
<div class="item">test6</div>
<div class="item">test7</div>
</div>
.list {
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
grid-column-gap: 48px;
grid-row-gap: 30px;
padding: 30px 0px;
}
.item {
width:200px;
height:200px;
border:1px solid;
display: flex;
align-items:center;
justify-content:center;
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.