Question

When i have a few content with work well. And if i just put something like a bunch of
it work fine as well. And if i remove the content from #content, it does work too. Since there`s too many code i’ll be pasting ti on pastebin.
On this screenshot the problem is shown:
http://postimage.org/image/ee448x5yp/
the footer is the black part and the green part is the html, body as you can see on the css.
Any possible solution? 🙁

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;
}

WHOLE SITUATION FIDDLE

http://jsfiddle.net/Vmvrd/

Answer 1

I think it work correctly, look at a fiddle example which I add to your edited post.