Случаи, когда нужно прижать футер к низу, заметно участились в моей практике. Дизайнеры требуют идеального совпадения графики с версткой. А иначе это их может обидеть. Зачем, мол, я ночи не спал, за что ты, мол, губишь гения дизайнерской мысли, своей никчемной версткой…
Несоответствие зачастую бывает именно тогда, когда на странице недостаточно контента, футер задирается вверх. Кроме того футер может путешествовать в зависимости от дисплея пользователя, что иногда искажает картину, которую мы хотели донести. Конечно, решение этому есть и даже не одно. Приведу один, на мой взгляд, удачный пример, как заставить прижаться футер к низу.
Создаем блок для контента, для футера создаем отдельный. Для блока content ставим абсолютное позиционирование и высоту 100%. То есть полный экран. Снизу, понятно, идет блок подвала, который нам нужно будет поднять отступом на его собственную высоту.
Блок пробку cork ставим для того, чтобы футер было видно на полном экране, высота его должна быть, как у footer.
Для наглядности приведу код html:
А такой у нас будет CSS:
Вот и все, запоминаем этот прием, используем по надобности.
