I am experimenting with a sticky footer for the first time on my website, but it doesn't seem to be working as expected. There is a large white space followed by a black area (which matches the color of my footer). You can see the issue at this link . I want the footer to align directly with the bottom of the content, which in this case is unstyled text. Below is the code I have been using - thank you for your assistance - Charley
CSS
/* sticky footer */
* {
margin: 0;
}
html, body {
height: 100%;
}
.wrapper {
min-height: 100%;
height: auto !important;
height: 100%;
margin: 0 auto -335px;
}
.footer, .push {
height: 335px;
background-color: #000;
}
#innerfooter {
width: 847px;
height: 335px;
position: relative;
background-image: url(../images/black_bar.png);
background-repeat: no-repeat;
text-align: left;
margin: 0 auto;
}
/* end sticky footer */