Internet Explorer | Chrome | Opera | Safari | Firefox | Android | iOS |
6.0+ | 1.0+ | 6.0+ | 1.0+ | 1.0+ | 1.0+ | 1.0+ |
Выровнять блочный элемент заданной ширины по центру горизонтали веб-страницы.
По умолчанию ширина блочного элемента принимает значение auto, и он, как правило, занимает всю доступную ширину. Поэтому описанным методом по центру можно выровнять только такой элемент, у которого явно задана ширина в процентах или пикселах. После чего к стилю слоя следует добавить отступ слева (стилевое свойство margin-left) и справа (margin-right) со значением auto. Впрочем, также можно воспользоваться универсальным свойством margin со значением auto (пример 1).
Пример 1. Выравнивание слоя по центру
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Выравнивание слоя по центру</title> <style> .center { width: 200px; /* Ширина элемента в пикселах */ padding: 10px; /* Поля вокруг текста */ margin: auto; /* Выравниваем по центру */ background: #fc0; /* Цвет фона */ } </style> </head> <body> <div class="center"> Длина вектора переворачивает положительный двойной интеграл. </div> </body> </html>
Результат примера показан на рис. 1.
Сайт