Footer not 100% bottom crossbrowser

Question

This is my first question here, so bare in mind that we may have some issues with code.

But the thing is that i\'m using a template (Cant remember what template atm

Answer 1

U have really messed your code a lot..!

Do these changes, it will work perfectly. remove html,body {height:100%}

/**** add CSS ***/
html {min-height: 100%;position: relative;}
body {margin-bottom: 288px;}/* height of footer */
footer {position:absolute;width:100%;left:0;right:0;bottom:0;}

delete that container tag from bottom of html page.

Answer 2

Alright, I got the footer to the absoulte bottom of the browser (Safari atm)

But the content gets hidden behind the footer, and thats no good.

Attaching image and code Screenshot CSS

Im really sorry for the messy CSS, but i really appreciate all help!