How to Make my Footer Push with Content?

Ok, so I have this footer on my page I'm designing, but I've encountered a problem; the footer sticks to the bottom of the page, but content can go past it... this is what I mean - http://i46.tinypic.com/2zted15.png.

Here is my the CSS/HTML code for my footer: http://pastebin.com/ZKCuBjhn

Thanks a lot in advanced.

Edit: Here is the code for the whole page - HTML code: pastebin.com/RAj11cPP --- CSS code: pastebin.com/0kMgb1R2

Note: The ridiculous amount of
tags in the code was to demonstrate my problem.

Solution

Try adding clear: both; to your footer style. It would be nice to see the code of the rest of the page howerver.

Real Answer:
After looking at your code, it seems like this is more what you want: http://pastebin.com/Letx9hPA

I changed you footer's position to fixed so that it stayed on the bottom of the page. If that isn't what you want then remove position all together so that it is free to be pushed down.

Also I wrapped your content in a content div so that I could add the spacer needed at the bottom to make it all visible. Spacer added by setting padding-bottom: 100px which is the height of your footer.