<div class="container">
  <div class="item">1</div>
  <div class="item">2</div>
  <div class="item">3</div>
  <div class="item">4</div>
  <div class="item">5</div>
  <div class="item">6</div>
  <div class="item">7</div>
  <div class="item">8</div>
  <div class="item">9</div>
</div>
.container{
  width:200px;
  height:200px;
  border : 4px solid;
  display:grid;
  grid-template-rows : repeat(3,1fr);
  grid-template-columns: repeat(3,1fr);
  justify-content : center;
  align-items : center;
  justify-items : center;
  align-items : center;
}
.item{
  background-color:skyblue;
  border :2px solid;
  width:30px;
  height:30px;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.