Как контейнер разместить по центру CSS

Для размещения контейнера по центру можно использовать следующие CSS свойства:

  1. display: flex; — устанавливает контейнеру гибкую модель блока
  2. justify-content: center; — выравнивает элементы по горизонтали по центру
  3. align-items: center; — выравнивает элементы по вертикали по центру

Пример:

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

Также можно использовать свойство margin со значениями auto для автоматического выравнивания по центру:

.container {
  margin: auto;
}

Оба способа работают для блочных элементов.

реклама

Качественный хостинг сайтов

реклама

Получите консультацию нашего маркетолога

Изучит ваш проект, подберет подходящие услуги и тарифы

Получите бесплатный аудит

Наш специалист сделает базовый аудит вашего проекта и предложит персональные предложения.

Закажите услугу Как контейнер разместить по центру CSS

Наш специалист свяжется с вами в ближайшее время и уточнит детали