Не удается получить CSS Sticky footer для работы. Что я делаю не так?

Question

Ну это мой первый пост здесь и действительно нравится сайт.

У меня очень простой (уродливый как грех) сайт, который я начал, и по какой-то причине я не могу заставить CSS Sticky работать в FireFox. IE работает, но FF показывает его на полпути вверх по странице.

URL-адрес является http://dev.aipoker.co.uk

Я знаю, что должен развиваться в FF и ошибка фиксации в IE, так что я предполагаю, я мог бы на самом деле допустил ошибку, а некоторые, как это работает в IE, но не где-то еще.

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

Спасибо, ребята и девочки.

Answer 1

Попробуйте это one, это хорошо работает на Firefox.

Кстати, вы должны слушать подкаст Boagworld, если вы этого еще не сделали. Это великолепно! :)

Cheers.

Answer 2

я имел успех с кодом вроде этого:

footer { 
    display: block; 
    position: absolute; 
    width: 100%; 
    bottom: 0px; 
} 

Answer 3

минимальных изменений я могу видеть, чтобы сделать это было бы:

• движения footerSection внутри тела
• набора позиции абсолютной как на теле, так и на нижнем колонтитулеОбъект
• комплект нижний = 0px на нижнем колонтитулеSection

, который заканчивается чем-то вроде этого в вашей голове:

<style type="text/css"> 
    #body, #footerSection { position: absolute; } 
    #footerSection { bottom: 0px; } 
</style> 

<div id="body"> 
    ... 
    <div id="footerSection"> 
     ... 
    </div> 
</div> 

Answer 4

Это все, что вам нужно знать о CSS только липкий нижние колонтитулы & липкие NAVS:

прилипают к нижней части страницы

Position: absolute; 
top:auto; 
bottom: 0; 

Придерживайтесь нижней части экрана

Position: fixed; 
top:auto; 
bottom:0; 

Любые проблемы, и это, вероятно, связано с тем, где вы разместили свой HTML-код (не делайте нижний колонтитул дочерним элементом, если он не привязан к обертке содержимого), или перекрывая CSS.

Вы можете применить ту же технику к липкой навигации, перевернув авто & сверху. It'sis кросс-браузер совместим (из памяти от IE7 и выше), включая мобильные телефоны.