badget

Biggest Sale! Special Offer!

Get 30% discount on all of our single themes with this coupon code: #30%SALE

Hurry up! *Limited time offer*
View all Themes

Footer to stick to the bottom

Tagged: 

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • November 14, 2014 at 10:02 pm #18527
    Daniel
    Participant

    I have been playing around with the CSS for Interface to get the footer to stick to the bottom, but nothing is sticking. What would the Custom CSS be required to get the footer to stick at the bottom of the page?

    November 21, 2014 at 6:55 am #18699
    Theme Horse Support Team
    Keymaster

    Hi Daniel,

    Sorry we are missing to reply this topic.
    Anyways Go to Appearance -> Theme Options -> Design Options Tab -> Custom CSS paste the following CSS code and Click on save all changes button to stick the bottom of the page:

    #site-generator {
    position: fixed;
    width: 100%;
}

    Thank you!

    November 27, 2014 at 12:15 am #18846
    Daniel
    Participant

    Unfortunately that CSS code did not work. I tried removing all the over custom CSS code, and it still did not work.

    November 30, 2014 at 8:36 pm #18955
    Daniel
    Participant

    I had a bit of fiddling around, and I think I might not have been clear with my request.

    The footer needs to remain at the bottom of the page, but it does not always need to show. What happens at the moment is that when I have a short page, the footer moves up and leaves white space below the footer. I do not want this to happen.

    On short page the footer should remain fixed to the bottom of the page.

    I have been looking at this page: http://matthewjamestaylor.com/blog/keeping-footers-at-the-bottom-of-the-page

    I am not quite getting the change I am looking for.

    December 3, 2014 at 8:11 am #19037
    Theme Horse Support Team
    Keymaster

    Hi Daniel,

    Oh now we got it what you are trying to say?

    We have visited the link http://matthewjamestaylor.com/blog/keeping-footers-at-the-bottom-of-the-page that you have provide and a CSS code compatible to our theme and it works.

    Go to Appearance -> Theme Options -> Design Options Tab -> Custom CSS paste the following CSS code and Click on save all changes button to stick the bottom of the page:

    html,
body {
   height:100%;
}
.wrapper {
   min-height:100%;
   position:relative;
}
#colophon {
   position:absolute;
   bottom:0;
   width:100%;
}

    Thank you!

  • Author
    Posts
Viewing 5 posts - 1 through 5 (of 5 total)
  • You must be logged in to reply to this topic.