CSS Grid Alignment + Centering

CSS Grid Alignment + Centering by Wes Bos

HTML

<link rel="stylesheet" href="https://cdn.rawgit.com/wesbos/css-grid/master/assets/style.css">
<div class="container">
  <div class="itm itm1">1</div>
  <div class="itm itm2">2</div>
  <div class="itm itm3">3</div>
  <div class="itm itm4">4</div>
  <div class="itm itm5">Wes Is Cool</div>
  <div class="itm itm6">6</div>
  <div class="itm itm7">7</div>
  <div class="itm itm8">8</div>
  <div class="itm itm9">9</div>
  <div class="itm itm10">10</div>
</div>

CSS

/*
  justify-items:
  align-items:
  justify-content:
  align-content:
  align-self:
  justify-self:
  justify-* is row axis
  align-* is column axis
*/
.container {
  display: grid;
  grid-gap: 20px;
  height: 500px;
  border: 10px solid var(--yellow);
  grid-template-columns: repeat(5, 130px);
  /* justify-items: center;
  align-items: center; */
  place-items: stretch stretch;
  justify-content: space-between;
  align-content: space-between;
}
.itm {
  background: white;
}
.itm5 {
  justify-self: center;
  align-self: center;
}