Почему мой нижний колонтитул опускается до конца?

Question

Сайт находится здесь:

http://www.cottonbrewing.com/members

Хорошо, если контент не требует страницу прокрутки.

CSS:

#footer {
    position:absolute;
    bottom:0;
    left:0;
    right:0;
    margin: 0 auto;
    font-size: 12px;
    font-weight: normal;
    clear:both;
    padding: 10px 0px 10px 0px;
    text-align: center;
}

Редактировать 1: Я также должен убедиться, что нижний колонтитул находится в абсолютном нижнем углу, если содержимое маленькое, как вы видите здесь: http://www.cottonbrewing.com/ что нижний колонтитул находится в нижней части.

Answer 1

Удалить bottom: 0; и изменить положение на относительное.

Answer 2

Изменить position:absolute; на position:relative;

Сложение

В ответ на комментарий следуйте этим указаниям для «липкого нижнего колонтитула»:

Body

body
{
  height:100%;
}

Ваш контейнер div:

#container
{
  min-height: 100%;
  position: relative;
}

Ваш нижний колонтитул div:

#footer
{
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 30px; /* can be changed, along with padding */
}