Positioning a footer with CSS

I'm trying to position a footer with CSS using the "FooterStickAlt" method described here: http://www.themaninblue.com/writing/perspective/2005/08/29/

I applied it to my site and it works fine, but IE (both 6 & 7) strangely puts a margin on the bottom of the page. This is very frustrating as it ruins the design of the footer.. I've tried fixing it with conditional statements but I haven't had any luck; I can't figure out what the problem is.

Here's the page I'm working on: http://66.177.54.253/allegory/index.php

Here is the relevant CSS from the page:

body,h1, h2,h3,p,ul {
margin: 0;
padding: 0;
}

html {
height: 100%;
}

body {
height: 100%;
font-family: "hoefler text", georgia, serif;
background: url(../images2/penrosebg.png) no-repeat center center fixed #5b5a4e;
color: #2E2D27;
}

* html #container {
height: 100%;
}

#container {
position: relative;
min-height: 100%;
width: 919px;
z-index: 1;
margin: 0 auto 0 auto;
border: 1px solid #545245;
border-top: 0;
border-bottom: 0;
background: url(../images2/page-middle.png) repeat-y center center #3D3C33;
}


#footer {
z-index: 8;
position: relative;
height: 52px;
margin: 0 auto 0 auto;
width: 922px;
border-top: 3px solid #898A7B;
background: url(../images2/border3.gif) repeat-y center center #FDFFED;
}
#widefooter {
position: relative;
bottom: 0;
left: 0;
height: 55px;
margin: -56px 0 0 0;
width: 100%;
z-index: 3;
border-top: 1px solid #545245;
background: url(../images2/border.gif) repeat-x 0 top #FDFFED;
}


Can anyone else figure this out?

Thanks.

In your body section at the top of your code, try changing the margin line to : "Margin: 0 0 0 0;"

This is a stupid IE flaw

on small websites I usually use something like this

* {
margin: 0;
padding: 0;
}

to make sure that all elements has the defaults I give it, for larger websites it might get a little slow, but then you can explicitly do the same for the tags you need to, at least be aware that different browsers has different default values.

I added both of those but I'm still having the same problem.

I'm gonna try recoding the CSS from scratch and see if I can identify the problem..

Wow, I redid the entire CSS and it turns out the only problem was that I used height: 100%; on an element in the footer instead of just using pixels...

Edit: nope nevermind, it's still broken -.-

K, apparently adding overflow: hidden; to the element fixes it. I have no idea why, but it works..