<div class="kapsayici">
  <div class="oge">1</div>
  <div class="oge">2</div>
  <div class="oge">3</div>
  <div class="oge">4</div>
  <div class="oge">5</div>
</div>
.kapsayici {
   display: grid;
   grid-gap: 1rem;
   grid-template-columns:  repeat(2, 100px);
   grid-template-rows: repeat(3, 50px);
   justify-content: center;
   border: 5px solid #085872;
   background: #00ceff;
   width: 315px;
   height: 250px;
   margin: 0 auto 20px auto;
}

.kapsayici > div {
  background: #ccebf3;
  padding: 10px;
}

body {
  margin: 30px;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.