CSS Grid: place-items

Finally, we have place-items: center for CSS Grid to make it easier.

HTML

<div class="parent"&gt
  <div class="to-center"></div>
</div>

CSS

.parent {
  display: grid;
  place-items: center;
}

Output:

html,
body {
  height: 100%;
}

.container {
  display: grid;
  place-items: center;
  height: 100%;
}

.center {
  background: