Как расположить футер, чтобы он всегда находился внизу, даже тогда, когда содержимое не занимает всю страницу? Для этого, контенту нужно задать высоту 100%. Но, не все так просто, пока в статистике присутствует ИЕ6.
Кроссбраузерное решение достигается следующим способом. В CSS нужно написать:
body, html {
height: 100%; /* это обязательно, иначе футер внизу не будет */
}
#content {
min-height: 100%; /* для всех нормальных браузеров */
height: auto !important; /* для всех нормальных браузеров */
height: 100%; /* это для ИЕ6, вместо min-height */
margin-bottom: -7em; /* отступ для футера */
}
#footer {
height: 7em;
}
Но все же, при наличии ИЕ7, существует одна проблема. При увеличении высоты окна браузера, под футером образовывается пустота, которая сразу же исчезнет если изменить ширину окна браузера.
Сколько же этих способов, но этот самый распространённый.
Простой и самый действенный
ну да, с этим не поспоришь.
Метод простой но для CMS не всегда подойдёт.
А при чём здесь CMS? Прежде чем подключить к CMS, нужно сверстать макет. И то что будет прописано в CSS, то и будет использовать CMS. CMS не отвечает за верстку в целом, а использует сверстанный шаблон.
Тоже не пойму при чем тут CMS
При этом методе появляется полоса прокрутки хотя контента на странице нету совсем
Вадим, а у вас есть более эффективное решение позиционирование футера?
В том то и дело, что нету. В поиске этого решения для себя. Может подскажите почему именно так у меня футер уходит далеко в низ, что появляется полоса прокрутки?
Вадим, я сейчас занимаюсь немного другим направлением, то что знаю и с чем сталкиваюсь, пишу в свой блог. Чтобы потом, если самому понадобится, было бы где посмотреть.
Это вы хорошо делаете)
Разобрался в чем была у меня проблема и этот метод также заработал!
Человек …явно написал про СMS потому что не понимает в шаблонизации… ведь есть движки использующие чистый html+css а есть смарти который тоже самое использует но более раскидано по файлам шаблона и модулей.
Pikasso, вы ничего не путаете? Здесь ни слова про СMS… Только чистый HTML+CSS.
я про комментарий http://atbliss.ru/footer-down-template/comment-page-1/#comment-67271
То что чистый HTML+CSS. это видно
Теперь ясно Тогда ОК.