Как расположить Div по центру родителя

Есть несколько способов центрировать div внутри родителя. Вот основные:

1. Flexbox (рекомендуется)

.parent {
  display: flex;
  justify-content: center;
  align-items: center;
}

2. Grid

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

3. Позиционирование (если известны размеры)

.parent {
  position: relative;
}
.child {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

4. Margin auto (для блочных элементов)

.child {
  width: 200px;
  margin: 0 auto;
}

Flexbox и Grid - современные и наиболее гибкие способы. Позиционирование подходит для сложных случаев, а margin auto - для простого горизонтального центрирования.