1

Possible Duplicate:
CSS sticky footer

Hi,

How can I get create a footer stick to the bottom of a screen (not page) despite there is scroll bar on the side? For example like this: http://www.sportingnews.com/

Thank you.

Community
  • 1
  • 1
michael
  • 106,540
  • 116
  • 246
  • 346
  • 2
    Possible duplicate of [CSS sticky footer](http://stackoverflow.com/questions/3906065/css-sticky-footer), plus [so many other sticky footer questions...](http://stackoverflow.com/search?q=[css]+sticky+footer). – David Thomas Dec 21 '10 at 21:45
  • let me google that for you.... – zzzzBov Dec 21 '10 at 21:57

4 Answers4

1

Fixed footer (Compatible with IE6)

You can see a demo here

Karoo
  • 542
  • 6
  • 19
0

Its called stickyfooter

http://www.cssstickyfooter.com/using-sticky-footer-code.html

Jakub
  • 20,418
  • 8
  • 65
  • 92
0

There are several ways, and each has its own advantages/disadvantages (especially browser-compatibility.) Probably the easiest is fixed positioning, which doesnt work in IE6.

.bar {
  bottom: 0;
  position: fixed;
  z-index: 2;  /* May need to be tweaked, depending on your design and functionality. */
}

If you need IE6 compatibility, you can implement a JS file which enables it (and more) for IE6. Check out ie7.js

simshaun
  • 21,263
  • 1
  • 57
  • 73
0
<div style="position: fixed;bottom: 0px;">Footer text</div>
Kyle
  • 1,757
  • 1
  • 12
  • 22