I am using this code and everything works in IE and in Firefox it works if the page is too short. But if the page has scrollable content the footer sits at the bottom of the view port and scrolls from there. Rather than being at the bottom of the long content. The behaviour is the same regardless of the positioning attributes.

Can anyone shed some light on this?

Thanks

http://www.hivemindz.com/hm/?q=node/37

Code:
html, body, #container {
	min-height: 100%;
	width: 100%;
	height: 100%;
}

/*
 * The "height" above is a hack for IE5+/Win.  Below we adjust
 * it using the child selector to hide from IE5+/Win
 */

html>body, html>body #container {
	height: auto;
}

/*
 * Without this, Moz1.0 adds a vertical scrollbar
 */

body {
	margin: 0;
	font-family: Arial, sans-serif;
}

#container {
	position: absolute;
	top: 0;
	left: 0;
}

#main {
	margin-bottom: 0;
	height: auto;
	padding: 0;
}

#pad {
	margin-bottom:1em;
	height:4px;
	padding: 0.2em;
	clear:both;
}
#footer {
  position:absolute;
  bottom:0;
  padding: 0.5em;
  font-size: 0.9em;
  text-align: center;
  background-image:url(images/botbanner.jpg);
  height:30px;
  width:98.75%;
  clear:both;
}