The blue footer always appears below the yellow content if the content height is bigger than the page height (and thus will be invisible sometimes), but stays on bottom of the page when content height is smaller than the page height. Try it out by resizing the browser window.
It is important that all containers in the element-tree above "container" are of height 100%.
Click "Page Source" in your browser menu to see CSS.
This was taken from http://www.cssstickyfooter.com

content ....content ....content ....content ....
content ....content ....content ....content ....
content ....content ....content ....content ....
content ....content ....content ....content ....
content ....content ....content ....content ....
content ....content ....content ....content ....
content ....content ....content ....content ....
content ....content ....content ....content ....
content ....content ....content ....content ....