2012-05-08 11 views
0

смотрите этот сайт в браузере Firefox:придерживаться колонтитула в нижней части страницы

http://www.imageworkz.asia/microtel

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

Мне нужны некоторые эксперты css, чтобы помочь мне с этим. Спасибо!

ответ

3

Там это кобылы, чтобы сделать липкие нижние колонтитулы. Основной трюк для колонтитула с фиксированной высотой

html, body { 
    height: 100%; 
} 
.wrapper { 
    min-height: 100%; 
    height: auto !important; 
    height: 100%; 
    margin: 0 auto -150px; /* the bottom margin is the negative value of the footer's height */ 
} 
.footer { 
    height: 150px; /* .push must be the same height as .footer */ 
} 

или

вы можете проверить это post (и многие другие) с названием «липкая сноска»

0

Добавить position:fixed; bottom:0; left:0 в нижний колонтитул, и он зафиксирует его на месте. Если затем добавить #container {padding-bottom:120px} (или что-то около этой суммы) ваш контент не будет скрыт колонтитула при просмотре нижней части страницы

0

Сделать это фиксированное положение с нижним 0 значение:

footer { 
    position: fixed; 
    bottom: 0; 
} 
0
<script type="text/javascript"> 
$(document).ready(function() { 
var docHeight = $(window).height(); 
var footerHeight = $('#footer').height(); 
var footerTop = $('#footer').position().top + footerHeight; 
if (footerTop < docHeight) { 
$('#footer').css('margin-top', 10 + (docHeight - footerTop) + 'px'); 
} 
}); 
</script>