Нижний колонтитул не остается внизу с контентом

Question

Когда у меня есть несколько материалов с хорошей работой. И если я просто положил что-то вроде пучка
, он тоже отлично работает. И если я удалю содержимое из #content, это тоже сработает. Поскольку существует слишком много кода, я буду вставлять ti на pastebin. На этом скриншоте изображена проблема: http://postimage.org/image/ee448x5yp/ нижний колонтитул - это черная часть, а зеленая часть - это html, тело, как вы можете видеть на css. Любое возможное решение? :(

HTML

<div id="wrap"> 
    <div id="header"> 
     ... 
    </div> 
    <div id="content"> 
     <div class="center"> 
       ... 
     </div> 
    </div> 
    <div id="footer"> 
     ... 
    </div> 
    </div> 

CSS

#wrap { 
    width: 100%; 
    min-height: 100%; 
    margin: 0 auto -75px; /* the bottom margin is the negative value of the footer's height */ 
    position: relative; 
    text-align: left; 
} 

#footer { 
    position: absolute; 
    bottom: 0; 
    height: 75px; /* Height of the footer */ 
    width: 100%; 
    background: #000; 
    text-align: center; 
    line-height: 103px; 
} 

ВСЯ ОБСТАНОВКА FIDDLE

http://jsfiddle.net/Vmvrd/

Answer 1

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

Answer 2

В нижнем колонтитуле есть элементы, которые выше его. Они расширяют body, но не нижний колонтитул, так как высота нижнего колонтитула фиксирована. Добавьте overflow: hidden к вашему #footer и работайте оттуда.