Tony Tambe Tony Tambe - 1 year ago 112
CSS Question

bootstrap layout - stick footer and content row to the bottom

I'm designing this site: I'm just at the point where I'm laying out the home page and I'm a bit stuck. I want a footer row at the bottom that lists contact info, and then directly above it is a row of 3 blurbs of information. The background images are the main visual feature of the page, so I'm trying to leave space for them to show through.

Can anyone help with some suggestions? If there's a better way to lay it out, I'd love some other advice.


Answer Source

There is a good footer tutorial at

The demo page is here:

The basic premise is that the main body page is stretched to a 100% of the page. With a min-height of 100% too.

The footer is then given the following rules:

   #footer {
 clear: both;
 position: relative;
 z-index: 10;
 height: 3em;
 margin-top: -3em;
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download