Sticky footer conflit

http://css-tricks.com/snippets/css/sticky-footer/ Here is the tutorial I'm following. But my content is absolute positioned, which is causing a conflict, and the footer is not going down at the very bottom of the page. So how can I solve this?

And here is my css:

html, body {

width:100%;
min-height:100%;
background-image: url(../img/bg.png);
background-repeat: repeat;

}

#wrapper {
width: 1024px;
margin-right: auto;
margin-left: auto;
min-height: 100%;
margin-bottom: -200px;

}
.site-footer, #wrapper:after {
/* .push must be the same height as footer */
height: 200px;
}

.site-footer {
background-image: url(../img/foot.png);
background-repeat:no-repeat;
position:absolute;
width:100%;
bottom:0;

}

#banner {
min-height: 100%;
position: absolute;
top: 24px;

}

#navigation {
height: 60px;
position: absolute;
left: auto;
width: 100%;
top: 23px;
min-height:100%;
z-index:1;
border: none;
}

#categoria {
position: absolute;
width: 710px;
min-height: 100%;
z-index: 0;
left: -29px;
top:30px;
padding: 0px;
z-index:1;

}