Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Sticky Footer becoming Mental Health Issue…

  • This topic is empty.
Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #25071
    EamonnMac
    Member

    Hi Guys and Gals,

    I beg of you, please, please, tell me what’s wrong with my @#$%&*>! footer. I’ve been looking at it for so long now, I probably couldn’t see the answer if it stared me in the face. It will not go to the bottom of the page (not screen) where it belongs – it won’t, doesn’t want to, will not try, FAILS. :cry:

    I’ve used Fait’s Sticky Footer, as well as the clearfix method, and neither will force my page-wrap beyond the height of my screen. What stupidly obvious mistake have I made with the following code?

    Quote:
    * { margin: 0; padding: 0; }
    html, body { height: 100%; }

    #page-wrap { width: 960px; position: relative;
    min-height: 100%;
    height: auto !important;
    height: 100%;
    margin: 0 auto -300px; }

    .footer { height: 300px; width: 960px; background: 0d2819; clear: both;
    position: absolute; bottom: 0px; margin: 0 auto; }
    .push { height: 300px; }

    It’s a site(my first!) I’m building for my dad about ponies – you can see it @ http://www.ashbrookstud.ie with the footer reduced to a 1px no-background empty travesty. I know you guys are probably sick of answering Sticky Footer problems, but know that I really appreciate any help – however small! – I can get with this. I want the site to be right.

    Thanks in advance

    Éamonn

    #58673
    apostrophe
    Participant

    Validating your code would be a good place to start http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fashbrookstud.ie%2F
    I don’t really see why you need to use any special techniques to force the footer to the bottom of the page, you seem to have plenty of content on all the pages, although only the home page appears to have a footer. I would just include it inside the page wrap.

    #58674
    EamonnMac
    Member

    Oops ! 23 errors! Now you’ve gone and embarrased me in front of everyone! :D

    Thanks though, I had no clue I had built up so many errors!

    None of the other pages have a footer precisely because I can’t seem to get one to work.
    I see what you mean about just including it manually as a div, but it still doesn’t stick to the bottom of the page. A bottom 0px positioning won’t do it because my page wrap doesn’t extend beyond the bottom of the screen. That’s the crux of it – if I can just get that wrap to extend I’m sorted.

    #58675
    Chris Coyier
    Keymaster

    Your page is so tall… I’m not really seeing any reason for using the sticky footer method here. Are there some pages I’m not seeing that are really short?

    #58676
    EamonnMac
    Member

    Nope, they’re all screen-height+. There’s no particular reason that I need a footer per se, but I tried to put one in to tie up the layout nicely. Then it didn’t work. Several times. Cue madness.

    I have tried to just put in a ‘footer style’ div after the content and sidebar divs and before closing off the page-wrapper. The problem seems to be that the content of those divs is overflowing downward rather than extending their boxes, so a following ‘footer’ div just sits halfway up the screen. For obvious reasons I can’t put an absolute value on their height though – would an overflow:hidden attribute or some such force them down?

    Aside from that, the sticky footer method should work. I can’t figure out why it doesn’t for the life of me. I thought I’d ask ye good gentlemen to put me out of my misery!

    #58677
    apostrophe
    Participant

    I’m pretty sure the problem is somewhere in your markup, you either have one extra div opening or one too few closing div. The best I can suggest at the moment, and it will be a right royal pain, is to go through your markup commenting every closing div to make sure you have them all in the right place.
    eg.

    Code:

    etc.

    #58681
    EamonnMac
    Member

    Sounds like it. Oh well… I’ll give it a go and let ye know how I get on.

    Thanks Lads!

    #58692
    EamonnMac
    Member

    Got it! Whoo Hooooo! I knew it’d turn out to be something stupid – Prob wasn’t with open divs, it was with some elements being absolutely positioned and thus being ignored by the footer div. All relatively positioned now and living happily together. For now….Dum Dum DUUUUUUMMMM!

    Thanks a million guys, I really do appreciate ye rowing in. I know where to come crying to now :D ! I’m going to put the site into the review section when I’ve the footer dickied up, so when ye see it up, let me have it with both barrels…

    Éamonn.

    P.S. Why is the crux of the bicuit an apostrophe?

    #58693
    Rob MacKay
    Participant
    "EamonnMac" wrote:
    P.S. Why is the crux of the bicuit an apostrophe?

    <mysticalness type="smoke/waving">

    Ahh the answer of enlightenment – if you have to ask the question my son, you are not ready to hear the answer…

    </mysticalness>

    #58694
    EamonnMac
    Member

    lol! Classic… "close mysticalness" :ugeek:

    I learn at the feet of the masters.

    #58698
    apostrophe
    Participant
    Quote:
    P.S. Why is the crux of the bicuit an apostrophe?

    Frank Zappa from the 1974 album Apostrophe http://www.bestlyric.com/lyrics/Frank%20Zappa/Stink%20Foot/4B17195852267376036E41 8-)

    #58715
    Rob MacKay
    Participant

    lol best thread ending – ever.

Viewing 12 posts - 1 through 12 (of 12 total)
  • The forum ‘CSS’ is closed to new topics and replies.