Липкий нижний колонтитул толкает содержимое ниже страницы

Question

Я попытался установить липкий нижний колонтитул отсюда

Вот jsfiddle http://jsfiddle.net/pbhE8/

И мой сайт: http://22twenty.com/Test

Как вы можете видеть, нижний колонтитул выдвигается за пределы содержимого.

Я не могу больше публиковать ссылки, но я уверен, что вы можете получить CSS и все, что вам может понадобиться на сайте.

Надеюсь, кто-то может помочь

Денвер

Answer 1

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

создать <div> то есть вокруг всего содержимого сайтов. Установите CSS этого div для:

#wrapper {
min-height: 100%;
width: 100%;
position: absolute;
}

Создайте раздел содержимого для середины страницы, куда будет добавляться основной контент вашего сайта с помощью css:

#maincontent {
width: 'some width';
height: 'some height';
margin-bottom: 'the height of the footer'
overflow: auto;
}

затем поместите ваш div нижнего колонтитула в нижний div с помощью css:

#bottom {
width: 100%;
position: absolute;
bottom: 0;
}

Тогда до тех пор, пока поля div основного содержимого равны высоте вашего div нижнего колонтитула, они не будут перекрываться, но нижний колонтитул будет находиться внутри "нижнего" div, который "прилипает" к нижней части окна браузера.

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