Sticky footer (for pages with little content)

  • Piotyras

    (@piotyras)


    9 years, 1 month ago

    Hello. Last time I wrote here, I received a lot of help – thanks a lot!

    Now I have a new question for all you smart individuals out there:
    Is there a way to make Invert Lite’s footer stick to the bottom of the screen, when displaying pages that contains very little content?

    For example:
    http://www.vitsi.dk/medlemskab/nyhedsbrev/

    The page above has almost no content, but will gradually gain more and more content over time. The footer is not stuck to the bottom of the page, which makes it look a bit strange, with so much white space underneath.

    Is this possible? Or would it require the entire theme to be re-written?

    Thanks in advance!

Viewing 2 replies - 1 through 2 (of 2 total)
  • Thread Starter Piotyras

    (@piotyras)

    9 years, 1 month ago

    Found the solution myself.
    I used this Custom CSS for http://www.vitsi.dk:

    Note: THE IMPORTANT ASPECT:
    #wrapper padding must be the same value as #footer height!

    #wrapper {
  background: none repeat scroll 0 0 #ffffff;
  box-sizing: border-box;
  min-height: 100%;
  padding: 0 0 190px;
  position: absolute;
  width: 100%;
}
#main {
  height: 100%;
  margin: 0;
  padding: 0;
}
#footer {
  background-color: #313131;
  color: #747474;
  bottom: 0;
  left: 0;
  height: 190px;
  position: absolute;
  width: 100%;
}
    Gunjan Rai kanungo

    (@gunjan-rai)

    9 years, 1 month ago

    Hello piotyras,

    I just got a look on this, good to see you find it yourself. I just wanted to suggest that “don’t customize directly in the theme files” and recommend you to use any custom CSS plugin or most preferably Child_Themes. So that your modifications would remain safe on any future Theme update as well.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Sticky footer (for pages with little content)’ is closed to new replies.