Вирівнювання DIV по центру

Коли використовувати DIV

Уявіть собі, що сайт — це холодильник, а DIV — це пластикові контейнери, з яким треба розсортувати вміст. Ви ж не будете класти фрукти в одну ємність з ліверної ковбасою. Кожен вид продукту ви покладете окремо. Аналогічним чином формується веб-контент.

Відкрийте будь-який сайт поділіть його на смислові блоки. Вгорі шапка, внизу футер, в центрі основний текст. Збоку зазвичай знаходиться колонка поменше з рекламним контентом або хмаринкою тегів.

<!DOCTYPE html>
<html lang=”en”>
<head>
<meta charset=”UTF-8″>
<title>Document</title>
<style type=”text/css”>

Дивіться також:  Як роздрукувати карту з "Яндекса": інструкція

</style>
</head>
<body>
<div class=”site-header”></div>
<div class=”main-content”></div>
<div class=”aside-column”></div>
<div class=”site-footer”></div>
</body>
</html>

Тепер розберіть кожну секцію детальніше. Почніть з header. У шапки сайту є окремо логотип, навігація, заголовок першого рівня, іноді слоган. Кожного змістового блоку призначте свій контейнер. Так ви не тільки розділіть елементи в потоці, але і зробите легше їх форматування. Вам буде набагато простіше вирівняти об’єкт в тегу DIV по центру, призначивши йому клас або ідентифікатор.