www html, html уроки, html теги, css, верстка
статьи html уроки книги по css и html урокам вопросы и ответы Помощь сайту
Главная страница > FAQ > Слои > Как выровнять слой по центру web-страницы?

Справочник по CSS (ЦСС) и ШТМЛ

Как выровнять слой по центру web-страницы?

По умолчанию ширина слоя принимает значение auto, и слой, как правило, занимает всю доступную ширину. Поэтому описанным методом по центру можно выровнять только такой слой, у которого явно задана ширина в процентах или пикселах. После чего к стилю слоя следует добавляем отступ слева (параметр margin-left) и справа (margin-right) со значением auto. Впрочем, можно применить универсальным тегом margin со значением 0 auto. Первый аргумент задает нулевое значение отступов сверху и снизу от слоя, а второй ? слева и справа.

Пример

Валидный HTML
Валидный CSS

<!DOCTYPE ШТМЛ PUBLIC "-//W3C//DTD ШТМЛ 4.01//EN" "http://www.w3.org/TR/ШТМЛ4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Выравнивание слоя по центру</title>
<style type="text/CSS (ЦСС)">
#center {
 width: 200px; /* Ширина слоя */
 padding: 10px; /* Поля вокруг контента */
 margin: 0 auto; /* Выравниваем по центру */
 background: #fc0; /* Цвет фона */
}
</style>
</head>
<body>
<div id="center">
Lorem ipsum dolor sit amet...
</div>
</body>
</html>

В браузере Internet Эксплорер выравнивание слоя работает только при установленном DOCTYPE.

Другие Уроки по этой теме
Поиск по сайту



FAQ

Copyright © 2009-2022 | По всем вопросам: donmobi@mail.ru

О нашем Internet проекте | Наши планы | Контент нашего сайта | Есть ошибки... | Технологии | Поддержать проект