Проблема с нижним колонтитулом HTML
Можно ли создать div нижнего колонтитула, который находится внизу сайта независимо от того, сколько информации присутствует в середине?
В настоящее время div у меня позиционируется в зависимости от того, сколько содержимого у меня в теле.
See also:
How do you get the footer to stay at the bottom of a Web page?
Ответы 4
Я ни в коем случае не эксперт по css, но это работает для меня во всех основных браузерах:
.d_footer
{
position:fixed;
bottom:0px;
background-color: #336699;
width:100%;
text-align:center;
padding-top:5px;
padding-bottom:5px;
color:#ffffff;
}
Просьба заключалась в том, чтобы поместить div внизу «сайта». Ясно, что это открыто для интерпретации между окном и страницей. Разумная интерпретация: окно; любой может вставить div внизу страницы.
Ни с кем. На самом деле довольно сложно добавить div внизу страницы, который будет придерживаться его независимо от того, заполнена страница или пуста.
Это, конечно, работает, но когда вы изменяете размер окна, нижний колонтитул перекрывает содержимое.
Разместите блок содержимого и используйте для блока нижнего колонтитула clear: both.
Я знаю, что пометил это как полученный, но в результате столкнулся с другой проблемой. Нижний колонтитул удобно располагается внизу страницы, однако, если контент выходит за нижний колонтитул, нижний колонтитул просто плавает над содержимым.
Есть ли способ сохранить нижний колонтитул внизу страницы, не перекрывая его, если контент выходит за нижнюю часть?
Мне кажется, что я использую iframe, но я не знаю, как это сделать.
Добавьте нижний отступ к вашему div содержимого, который равен максимальной высоте вашего div нижнего колонтитула.
Вероятно, проще всего было бы применить тот же стиль, что и для нижнего колонтитула, к div контейнера, за исключением того, что указать фиксированную «высоту» для нижнего колонтитула и использовать то же количество пикселей, что и «нижняя» позиция вашего контейнер div. Однако короткий текст содержимого будет выровнен по нижнему краю.
Джонатан Мюллер прав, это прекрасно работает.
Я просматривал сообщения, пытаясь сделать это вот так. Все, что я смог найти, было прикреплено к нижней части окна. Спасибо!
Разве это не поместит его внизу окна, а не на страницу?