Search code examples
csssticky-footer

100% elements with sticky footer

I'm working with bootstrap V3. I've seen working code that provides a solution to the sticky footer problem but this then stops me from having any div elements with 100% height in the body which I need.

Does anyone know of any solutions to this issue without using any javascript?

Thanks.

Solution

  • Add display: table to your parent element (like the body) and then on your footer, add 

    display:        table-row; 
vertical-align: bottom; 
height:         1px;

    The height isn't going to make the footer only 1px tall, so don't worry about that.

    That's what I usually do, always works for me when using bootstrap.