• Страница 1 из 1
  • 1
Форум » Территория вебмастера » Начинающему вебмастеру » Центрирование блока в горизонтальном виде CSS (Абсолютное горизонтальное и вертикальное центрирование в CSS)
Центрирование блока в горизонтальном виде CSS
Kosten
Дата: Среда, 29.08.2018, 02:07 | Сообщение 1
Администраторы
Сообщений:18097
Награды: 55


В статье подробно разберем и представляет технику идеального горизонтального центрирования с помощью CSS на любой ширине или высоте. Такой вариант осуществляют с фиксацией элемента в горизонтальном виде, так как блок является гибким, он просто займет всю доступную ширину. Как в большинстве пишут по этому вопросу, что самый актуальный способом центрировать горизонтально элемент, то здесь по мнению многих веб мастеров является следующие свойство.



Контейнер:

Он должен обязательно иметь text-align: center;

Поле содержимого:

Здесь так должно display: inline-block;

HTML

Код
<div class="kargune-avanige">
  <div class="putusain-middle-element">
    ЦЕНТРИРОВАНИЕ
  </div>
</div>

CSS

Код
.kargune-avanige {
    width: 100%;
    height: 120px;
    background: #a7a0a0;
    text-align: center;
}

.putusain-middle-element {
    display: inline-block;
    background: #53555a;
    padding: 20px;
    border: 1px solid #bfb9b9;
    color: #d9e4f7;
}


Демонстрация
Прикрепления: 1565280.png(3.3 Kb)
Страна: (RU)
Форум » Территория вебмастера » Начинающему вебмастеру » Центрирование блока в горизонтальном виде CSS (Абсолютное горизонтальное и вертикальное центрирование в CSS)
  • Страница 1 из 1
  • 1
Поиск: