Sticky / Tearaway Footer

sticky tearaway footer

- 9 years, 5 months ago dcheney888
  Participant
  
  Expired
  
  Hi,
  
  I’m having issues getting my footer to “stick” to the bottom of the page with the Specular Theme, so that there is no whitespace below it. (demo of what I want to do: https://www.cssreset.com/demos/layouts/how-to-keep-footer-at-bottom-of-page-with-css/)
  
  I tried finding a setting within theme itself, and then tried using custom CSS with absolute positioning, but was failing hard… (even after trying to add !important after every line)
  
  Can you please tell me either what button I’m missing, or what CSS I should use, to get the footer to “stick” in Specular – thanks.
  
  Thanks.
- 9 years, 5 months ago Ruco
  Keymaster
  
  Hello,
  
  It’s because you haven’t added enough content. Can you show us your site url?
  
  Regards!
- 9 years, 5 months ago dcheney888
  Participant
  
  Expired
  
  Hi here is a page that isn’t work that has some content but not “enough” to force the footer to the bottom
  
  https://cheneyconsultingservices.com/services/
  
  (other pages are fine since they have tons of content)
  
  Code wise I tried:
  
  #footer{
  
  width:100% !important;
  
  position:absolute !important;
  
  bottom:0 !important;
  
  left:0 !important;
  
  }
  
  but the footer ends up sticking to the header, versus the bottom of the page.
- 9 years, 5 months ago Kris
  Participant
  Hello,
  Please add this code to your custom CSS Box :
  
  #content { min-height:650px; }
  
  Best regards!
  
  This reply was modified 9 years, 5 months ago by Kris.
- 9 years, 5 months ago dcheney888
  Participant
  
  Expired
  
  Good idea – didn’t think about min-height on context. Not the approach I was thinking but works :)

Viewing 4 reply threads

You must be logged in to reply to this topic.

Community Forums

Site Links

Useful Articles

Login