В статье подробно разберем и представляет технику идеального горизонтального центрирования с помощью 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;
}
Демонстрация
