So I’m trying to add a footer to a website I’m working on. I’m using a method I found on fortyseven media (http://fortysevenmedia.com/blog/archives/making_your_footer_stay_put_with_css/). However, in order for this to work, I need to have my content div relatively positioned. Before I tried adding the footer, it was absolutely positioned, making it looks nice and pretty directly in the center of the page with no "white space" underneath the div. Now that I have it relatively positioned, it’s still centered and looking nice, but there’s a ton of space underneath the content div and above the footer div.
I know why the space is there (since the element is relatively positioned, it left a gap where the element would normally be), but I do not want the space to be there. It’s really annoying and is unneeded.
Is there a way to remove the gap at the bottom of my content div while still being able to keep it relatively positioned? :roll:
Well, I’ve figured out some of my problems. Now I’m just trying to fine tune things.
For example, I can’t figure out why I’m still able to scroll on pages without a ton of content (like the Home, Performances, Auditions, and Outreach pages).
Also, when the page isn’t maximized, the footer seems to stay the same size instead of shrinking with the browser (sorry if I didn’t explain that well… If you resize the browser I think you’ll understand what I mean).
I think I want to keep the overflow value so that when someone goes from a page with not enough content to fill their browser to a page full of content there are not any jumps due to the scrollbars. I might just change the min-height of the container like you said. If I did this, would it affect the footer?
I also just want to know why there is there are scrollbars that are able to be moved on pages without a lot of content. Is it due to the overflow value?