Fixed Positioning at bottom of web page

[muyeshi]

Hi people,

How can I place the footer as a block element at the bottom of the web page in a fixed position?

[Rogem]

in your CSS:

#footer{
	position:absolute;
	bottom:0px;
	margin-top:auto;
}

In your HTML

<div id="footer">Hello</div>

That seems to work ok my end (FireFox 3)

Edit: just found this ( http://ryanfait.com/resources/footer...ottom-of-page/ ) it's a useful link.

[muyeshi]

What I actually meant is that when I scroll the page, the footer should remains fixed at the bottom of the web page. How do I do it?

[AutisticCuckoo]

#footer {
  position:fixed;
  bottom:0;
  left:0;
  width:100%;
}

This won't work in IE6 and older, since those versions don't support fixed positioning. You'll either need an ugly workaround or use JavaScript for that, but you could also accept that it won't work in those browsers that are more than 8 years old.

[muyeshi]

#footer {
  position:fixed;
  bottom:0;
  left:0;
  width:100%;
}

This won't work in IE6 and older, since those versions don't support fixed positioning. You'll either need an ugly workaround or use JavaScript for that, but you could also accept that it won't work in those browsers that are more than 8 years old.

Thank you. It worked for me.