Центрирование элемента

Для центрирования элемента внутри его родителя можно использовать CSS-свойство place-items: center.

Сперва надо указать сетку в качестве метода отображения, а затем добавить CSS-свойство place-items: center для того же элемента. place-items — это сокращение для одновременной установки свойств align-items и justify-items. Установка значения center одновременно для align-items и justify-items разместит элемент в центре контейнера.

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

Это позволит идеально центрировать содержимое внутри родителя, независимо от внутреннего размера.

See this code Super centered on x.xhtml.ru.