Forum Moderators: not2easy
I have a simple footer on the bottom of all my pages that looks like this:
<div id="f">© Copyright 2007.</div>
And using CSS I have stylized the div to have a background that matches the site, as well as a height of 15px.
It works great for longer pages, but for shorter pages I would like for the div to extend all the way to the bottom of the page.
I know I would need to change the height, but I haven't figured what it needs to be.
I've changed height to "auto" and "100%", but that doesn't work.
I've even tried giving my body a height of "auto" and "100%", but that doesn't work either.
The only thing that does work is both page and div to be set to 100%, but then I get a really unprofessional blank space at the bottom of all my pages.
Any advice? Thanks.
The key to realizing this is that CSS knows nothing of your window size, meaning it can't tell if or when it needs to expand.
I think i might have tried doing this once though... I was playing around with relative heights and fixed hieght combos, I think I might have gotten the effect somewhat, but I'll need to go find the site and see if it's what I'm thinking of.
Why exactly do you need it to expand like that, though?
With a couple of changes to my CSS I was able to make it work.
I'm using multi column layout on my site, and I was having some problems with division lines. Instead of going with division borders on the left or right, I decided to go with a background with these lines built in.
I have a header and footer with a solid background that lays over the lined background which helps blend everything together.
It worked fine except on short pages where the content didn't reach to the bottom of the page, leaving a large area with a lined background below my footer.
Thanks everyone again. Your assistance was very helpful to me.
