Нижний колонтитул CSS Позиционирование

Question

Я искал всюду, и я не могу найти ответ на этот вопрос - Очевидно, что я делаю что-то неправильно. Вот мой колонтитул CSS:

#footer { 
    position: fixed; 
    bottom: 0px; 
    left: 0px; 
    margin: 0px; 
    width: 100%; 
    height: 60px; 
    padding-top : 10px; 
    background-image:url(../images/bottom_bg.jpg); 
    background-repeat:repeat; 
    text-align:center; 
    border-top: 5px solid #000; 
    font-family:Verdana, Arial, Helvetica, sans-serif; 
    font-size:12px; 
    font-weight:bold; 
    color:#FFCC66; 
} 

www.bevwebdev.com/examples.php

• Какого чёрта я делаю не так ?? Я пробовал z-index, установив высоту, только работает для таблиц, положение: абсолютное просто вставляет его в середину моих более коротких страниц - какая головная боль !!!

Answer 1

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

#container { 
    margin-bottom: 100px; 
} 

Это ставит 100px заготовки Несс ниже DIV так, когда в самом низу страницы, весь текст все еще показывает.

Answer 2

Если вы хотите всегда футер быть ниже всего остального, вы должны использовать position: relative

Если вы хотите всегда футер быть прикреплена к нижней части браузера, вы должны использовать position: fixed

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

Answer 3

Если вы хотите в нижней части страницы, чтобы не быть скрыты под колонтитула добавить CSS:

body { 
    padding-bottom:100px; 
} 

Или номер, который подходит именно вам. Это немного подтолкнет содержимое тела, чтобы вы могли его увидеть.