By cmcguinness on

Is it possible to get the footer div to expand to the hight of the screen regardless of how much content is there.... e.g. www.brainplay.ie/help - there is no content on this page to show you how the footer div rides up the page. I want to make it stick to the bottom of the screen, is this possible?

Thanks,
Ciaran

⋅ Categories: Drupal 6.x

Comments

bohz’s picture

bohz commented

Not 100% sure, but you should be able to deal with this issue with CSS only.
My bookmarks are quite old (and I never used any of these techniques), but the following links may give some info to start.
Cheers

http://www.themaninblue.com/experiment/footerStickAlt/
http://ryanfait.com/sticky-footer/
http://www.cssstickyfooter.com/
http://www.alistapart.com/articles/footers

adamscottmartin’s picture

adamscottmartin commented

You will want to use some CSS like this (obviously edit to suit your design):

position: absolute;
left: 0;
bottom: 0;
cmcguinness’s picture

cmcguinness commented

Thanks for you help. Unfortunately I can't this working as it makes the image disappear altogether. I then thought if I put ' height:100%;
min-height:100%; ' in the .main div it might work but it wont respond to min-height as a percentage.... e.g. www.brainplay.ie/h

however if I put a value in with pixels, e.g. min-height 100px; it works?

avolve’s picture

avolve commented

I am working on a theme right now that uses the footerStickAlt method & and have it working... mostly.

The theme is far from finished and still in very early testing, though the only issue i have is that the footer is partly below the browser window (not wholly on screen like in the examples). I have yet to work out why, and have only tested in FF so far. If I find a workaround/solution, I will post back here.

[update]

I have placed the theme on a test server, and have the footerStickAlt method working in FF, Safari, Opera, though not yet in IE.

you can view it at http://sbox.salter.id.au

It is a Zen sub-theme (D6) with a modified page.tpl to move the footer outside the page element. The current issue is the footer bg not showing up in IE...

avolve designs | ethical by design

gausarts’s picture

gausarts commented

I don't know if it may help you, I wrote a tut on how to mimic facebook chat panel. In your case, you have to make sure the correct z-order to keep the footer below other elements of the page. Hope it is in the right direction you wanted to achieve.

love, light n laughter