Amazingly Simple and Beautiful. Brand spankin' new free SMF themes every month.

CSS Sticky Fixed Footer

Mick in Tutorials
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.

Code: [Select]
#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:

Share This Post

Mick

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 Tacos and Pizza.

    


0 Comments



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.




go up