Прижать футер к низу страницы
Наверное самый распространённый способ прижатия футера к низу страницы:
Необходимая разметка:
<body>
<div class="wrapper">
Шапка
Контент
Колонки
<div class="footer-push"></div>
</div>
<div class="footer">
Подвал
</div>
</body>
CSS:
html, body {
height: 100%;
margin: 0;
padding: 0;
}
.wrapper {
min-height: 100%;
height: auto !important;
height: 100%;
margin: 0 0 -100px 0; /* отрицательный нижний отступ на высоту футера */
padding: 0;
}
.footer-push, .footer {
height: 100px;
margin: 0;
padding: 0;
}
Работает во всех браузерах.
Единственное момент — у body, врапера и футера нельзя указывать положительные верхний или нижний margin/padding. Сделать это можно для вложенных элементов.
Комментарии:
Нету комментариев для вывода...