Stick footer in bottom

  • Resolved rafaeltsantes

    (@rafaeltsantes)


    5 years, 7 months ago

    Hello,

    I’d like to stick the footer on bottom of the page without it being stuck there. What I mean: the footer in the home page (amongst other pages) is in the middle of the page because there is not much content so it could be at the bottom. I’d like it to be at the bottom regardless the content, butI dont want to to stick/fixed on a certain position at the bottom as the content might end up to be too much and the footer will not be adjustable to it. I want it to be adjusted to the content if the content is much more and if the content is not much, i want it to be on the bottom of the page, regardless. What I’ve temporarily done is put a block of spacer thorugh the edit page and the footer is at the bottom but i’d like to use coding or some other way that is not a fake way as it might be bad in the long run if things/contents change etc.

    Cheers.

    The page I need help with: [log in to see the link]

Viewing 2 replies - 1 through 2 (of 2 total)
  • tugbucket

    (@tugbucket)

    5 years, 7 months ago

    You can try:

    #site-content { min-height: 100vh; }

    But that’s going to shove the footer off the page on pages where you don’t have enough content. If that’s a big deal you can try to “figure out” your footer height and use CSS calc instead. You have 80px of combined top and bottom padding on your footer so you can try:

    #site-content { min-height: calc(100vh - 80px); }

    That will still shove the footer off the page like the first but obviously less so. Since you don’t have a fixed height you can just play with the 80px if you like.

    Thread Starter rafaeltsantes

    (@rafaeltsantes)

    5 years, 7 months ago

    Hey! that did the trick, though i changed 80px to 220px so its not going off the page. thanks a lot!!!!

Viewing 2 replies - 1 through 2 (of 2 total)

The topic ‘Stick footer in bottom’ is closed to new replies.