CSS Sticky Fixed Footer

Mick in Tutorials on Jul 15, 2013


There are many ways to keep your footer stuck to the bottom of the page, a very simple method used below can be applied easy to SMF index.css file. This CSS footer stylesheet will make a footer stick to the bottom of the page.


Open index.css file and at the very end, add this code.


#footer {
    position: fixed;
    left: 0px;
    bottom: 0px;
    width: 100%;
    background-color: rgb(65, 131, 196);
    color: rgb(255, 255, 255);
    font-size: 14px;
    padding: 30px;
    text-align: center;
}

/* ie6*/
* html #footer {
    position: absolute;
    top: expression((0-(footer.offsetHeight)+(document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight)+(ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop))+'px');
}






Tagged with:


Mick

Mick G

  idesignsmf.com

    

Mick is an American theme designer for Simple Machines Forum software currently living in South Florida, USA. He runs idesignSMF and started tinkering with SMF in 2006 where he created several SMF forums of his own before he founded idesignSMF in 2009 to which he is dedicated full time and has a weakness for Pizza.

  Connect with us:

     

  Improve SMF

If you wish to contribute to the development of SMF you can contribute to the coding discussions taking place on Github. You are also welcome to suggest features which you would like to see added to the software in the Feature Requests board.

  Receive our monthly newsletter right in your inbox.
Commitment issues? Unsubscribe at any time.

Get 100% complete access to our entire collection and find out why 11,211 SMF owners prefer our themes



0 Comments








  Professional & Impressive. We provide top quality free SMF themes with excellent support.