Div Positioning Problem
I have this website that I am having a problem with positioning my footer div. I would like it to stay at the bottom of the website, regardless of the content div's length. Doing this with server side scripting is easy. But when this website goes live, I am not going to have access to server side scripting.
When I take the footer div out of sercoWrapper div/class, the footer appears behind my header div. When I place the footer div back inside sercoWrapper div/class and but below the content div, it renders in the middle of the content div.
Can someone point out my mistake??
Basically everything that you have as absolute positioned does not have a height even though at one point you are setting it to 100% it still does not have a height because the parent element above it is also set to absolute and does not have a height.
Start with changing all your elements back towards relative instead of absolute and rip out the top, right, bottom, left css definitions.
Good advice. The worst thing to do as a newcomer to CSS is to position everything. What you want to do as a newcomer, is position NOTHING. Only when you really understand what positioning is and how to use it should you start to use position:relative and position: absolute (position:static is the default and is the only one that anyone new to CSS should use, as stated above).
All that being said, after you do what infinityspiral suggested, this demo will help you - http://ryanfait.com/sticky-footer/