Support » Fixing WordPress » Fix footer to bottom

  • ataner

    (@ataner)


    Hi,

    I am trying to fix the footer to the bottom of each page. Anything I tried by so far has not worked out. I am sure it is something very simple but I do not seem to figure it out. Any idea?
    My site is http://www.szur.org and the css as follows:
    Thank you!

    /* Footer */
    #footer-wrap {margin:0;}
    #footer {width:950px;padding:1.5em 0;margin:0 auto;color:#999;font-family:american typewriter;text-align:left}
    #footer p {color:#C0C0C0}
    #footer h3 {margin:0;padding:0 0 .6em 0; border-bottom:none; color:#C0C0C0}
    #footer .item {margin:0 0 4em 0}
    #footer ul{list-style:none;margin:0 0 1.6em 0;font-size:1em;}
    #footer ul li a,ul.txt li{height:1%;line-height:1.4em;display:block;padding:6px 0 6px 8px;}
    #footer ul li a:hover,ul.txt li:hover{color:#fff;background-position:1px 0.8em;background: #111}
    #footer ul li a span,ul.txt li,h4 a span{color:#696455;}
    #footer ul li.active a{cursor:default;color:white;}
    #footer ul ul{margin:0;list-style:none;}

Viewing 9 replies - 1 through 9 (of 9 total)
  • esmi

    (@esmi)

    Forum Moderator

    What’s wrong with your footer? A link to a page where it isn’t at the bottom of the page might help.

    ataner

    (@ataner)

    Hi esmi,

    The footer has different placement on several pages.
    Here it is within the div:
    http://www.renataszur.com/contact

    Here it is outside of the div:
    http://www.renataszur.com/portfolio

    I would like to add a fix place to the footer so it would appear outside the div on the bottom left on every single page. Some pages like the one above has not got enough content, hence the footer is in the middle of the page. Is it possible to make the footer drag the div content down to the bottom? I hope it makes sense. Thanks.

    esmi

    (@esmi)

    Forum Moderator

    Try adding clear:both; to #footer in style.css.

    ataner

    (@ataner)

    Thanks esmi. Unfortunately it did not work. I added it as follows. Have I done something wrong?

    #footer {width:950px;padding:1.5em 0;margin:0 auto;color:#999;font-family:american typewriter;text-align:left;clear:both}

    esmi

    (@esmi)

    Forum Moderator

    No- there’s nothing wrong with what you have added but the issue may lie far deeper within the design – which would take time to pick apart.

    ataner

    (@ataner)

    Thanks. Does it have to do something with the CSS or with the theme itself? Is there a way I could actually fix it?

    http://ryanfait.com/sticky-footer/

    see if anything there helps you out….I’ve seen several people on here get good results

    ataner

    (@ataner)

    Thanks! It worked. It picked the footer out of the div, however it did not drag the div down on those pages where the div container does not have full content. Is it possible to make the div container automatically adjust to the size of the screen? To have the footer in the middle of the page is pretty annoying. E.g. here: http://www.renataszur.com/portfolio

    ataner

    (@ataner)

    The stylesheet looks like this now. It might help.

    /* Footer */
    #footer-wrap {min-height: 100%;height: auto !important;height: 100%;margin: 0 auto -5em;}
    #footer {width:950px;padding:0 0 .5em 0;margin:0 auto;color:#999;font-family:american typewriter;text-align:left;clear:both}
    #footer p {color:#C0C0C0}
    #footer h3 {margin:0;padding:0 0 .5em 0; border-bottom:none; color:#C0C0C0}
    #footer .item {margin:0 0 5em 0}
    #footer, .push {height: 5em;}
    #footer ul{list-style:none;margin:0 0 1.6em 0;font-size:2em;}
    #footer ul li a,ul.txt li{height:1%;line-height:1.4em;display:block;padding:6px 0 6px 8px;}
    #footer ul li a:hover,ul.txt li:hover{color:#fff;background-position:1px 0.8em;background: #111}
    #footer ul li a span,ul.txt li,h4 a span{color:#696455;}
    #footer ul li.active a{cursor:default;color:white;}
    #footer ul ul{margin:0;list-style:none;}

Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘Fix footer to bottom’ is closed to new replies.