sticky footer on the bottom of the page

Question

I know that there are tons of answer out there. I spent many many hours trying to figure out what it not working.

I want to have a sticky footer. the html structure is like this

<body>
<div id=container>

  <div id=header>
  </div>

  <div id=body>
     <div id=left>
     </div>
     <div id=center>
     </div>
     <div  id=right>
     </div>
  </div>

 <div id=footer>
     </div>

</div>
</body>

and a link with the css and the content link

http://www.cssstickyfooter.com/ There are *beyond* tons of answers here on Stack Overflow alone. Do some research before you ask a question. — TylerH, Jun 23 '14 at 19:48

score 0 · Answer 1 · answered Jun 23 '14 at 19:49

0

Change your footer position from "absolute" to "fixed"

answered Jun 23 '14 at 19:49

joshboley

1,143
6
10

score 0 · Answer 2 · answered Jun 23 '14 at 19:52

0

If you want to have the footer always be at the bottom of the screen/window you can add the following to your css

#footer {
    position: fixed;
    bottom: 0;
}

answered Jun 23 '14 at 19:52

Yaaso

401
3
5

sticky footer on the bottom of the page

2 Answers2