Помимо свойства text-align, для центрирования контента в CSS можно использовать следующие альтернативные способы:
- Margin: auto. 13 Это способ горизонтального центрирования блочных элементов. 13 Margin — это отступ между блочным элементом и краем его контейнера. 1 Если отступ одинаковый со всех сторон, элемент будет центрирован относительно контейнера. 1
- Flexbox. 13 Инструмент для центрирования и упорядочивания элементов веб-страницы как по горизонтали, так и по вертикали. 1 Flexbox автоматически адаптируется под размеры контента, сохраняя центральное положение элементов при изменении размеров окна браузера. 3
- Grid Layout. 13 Инструмент для точного позиционирования элементов. 3 При центрировании div-блока grid-система позволяет выравнивать элементы как по горизонтали, так и по вертикали одновременно. 3
- Центрирование с помощью внутренних отступов. 4 Если элемент помещается в одну строку, то его можно отцентрировать с помощью одинаковых верхних и нижних внутренних отступов (padding). 4
- Использование свойств таблиц. 4 Свойство vertical-align действует для ячеек таблиц. 4 Нужно представить родительский элемент как таблицу, а дочерний — как ячейку, и применить свойство vertical-align: middle для вертикального центрирования содержания. 4