Acidon
Acidon

Reputation: 1334

Footer <div> not staying at bottom of page when I scroll - CSS & HTML

My footer is not all the way on the bottom. It should be the very last thing on the bottom of page below the fold. All I need is to have a footer at the bottom of page, not the bottom of screen.

You can see it here: http://bit.ly/zftRi3

Upvotes: 1

Views: 5158

Answers (4)

ThinkingStiff
ThinkingStiff

Reputation: 65381

Remove position: absolute; from <div id="footer">. Since your footer is after all your other HTML, that is the default behavior.

Demo: http://jsfiddle.net/ThinkingStiff/NwdGN/

Upvotes: 2

Andres I Perez
Andres I Perez

Reputation: 75409

Change your footer from position:absolute !important to position:relative and it should flow with your page to the bottom.

Upvotes: 2

Niet the Dark Absol
Niet the Dark Absol

Reputation: 324790

Change position: absolute to position: fixed.

Upvotes: 2

Only Bolivian Here
Only Bolivian Here

Reputation: 36773

Try this:

#page-container {
    margin: 0 auto;
    overflow: hidden;
    width: 999px;
}

#footer {
    background: url("../../skin/fashion_mosaic_grey/css/../images/fashion_mosaic/horiz_separator.gif") repeat scroll left top transparent;
    clear: both;
    height: 68px;
}

Edit:

Remove the bottom property of .footer and it works. :)

Upvotes: 0

Related Questions