Проблема с нижним колонтитулом HTML

Можно ли создать нижний колонтитул div, который находится внизу сайта, независимо от того, сколько информации находится в середине?

В настоящее время div, который у меня есть, позиционируется в зависимости от того, сколько контента у меня есть в теле.

Смотрите также:

Как сделать вы хотите, чтобы нижний колонтитул оставался внизу веб-страницы?


html footer
person Razor    schedule 11.10.2008    source источник

Ответы (4)


arrow_upward
11
arrow_downward

Я ни в коем случае не эксперт по css, но это работает для меня во всех основных браузерах:

.d_footer
{
    position:fixed;
    bottom:0px;
    background-color: #336699;
    width:100%;
    text-align:center;
    padding-top:5px;
    padding-bottom:5px;
    color:#ffffff;
}
person JasonS    schedule 11.10.2008
comment
разве это не поместит его в нижнюю часть окна, а не на страницу? - person Stephen Wrighton; 11.10.2008
comment
Запрос состоял в том, чтобы поместить div внизу сайта. Ясно, что это открыто для интерпретации между окном и страницей. Разумная интерпретация: окно; любой может вставить div внизу страницы. - person yfeldblum; 11.10.2008
comment
Ни кто. На самом деле довольно сложно добавить div внизу страницы, который будет прикрепляться к ней независимо от того, заполнена страница или пуста. - person e-satis; 20.11.2009
comment
Это, конечно, работает, но когда вы изменяете размер окна, нижний колонтитул перекрывает содержимое. - person ant; 05.01.2010

arrow_upward
2
arrow_downward

Плавающий элемент содержимого, а в нижнем колонтитуле используйте clear: both.

person Jonathan Mueller    schedule 11.10.2008

arrow_upward
1
arrow_downward

Я знаю, что пометил это как ответ, но в результате я столкнулся с другой проблемой. Нижний колонтитул хорошо расположен внизу страницы, однако, если содержимое выходит за пределы нижнего колонтитула, нижний колонтитул просто нависает над содержимым.

Есть ли способ сохранить нижний колонтитул внизу страницы, не перекрывая его, если содержимое выходит за пределы нижней части?

Я чувствую, что использую iframe, но я не уверен, как это сделать.

person Razor    schedule 13.10.2008
comment
Добавьте нижний отступ к вашему контенту div, который равен максимальной высоте вашего нижнего колонтитула. - person Keith Williams; 13.10.2008
comment
Вероятно, проще всего было бы применить тот же стиль, что и для нижнего колонтитула, к контейнеру div, за исключением указания фиксированной высоты для нижнего колонтитула и использования того же количества пикселей, что и нижняя позиция вашего контейнера div. Однако короткий текст контента будет выравниваться по нижнему краю. - person Adam Bellaire; 13.10.2008

arrow_upward
0
arrow_downward

Джонатан Мюллер прав, это прекрасно работает.

Я просматривал сообщения, пытаясь сделать это так. Все, что я смог найти, было прикреплено к нижней части окна. Спасибо!

person Meta    schedule 07.05.2010