Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS

Posted by Marco Roman
Marco Roman
5,527 Points

Best way to handle Footers with different content size.

Hello, I am currently watching the Framework Basics course and want to incorporate a footer in Bootstrap just like Guil did. My question is, if I create a site with a link to an about page that has a small minimal paragraph, how do I get the footer to stay all the way down? Right now since I don't have much content in an about page, the footer rises all the way to the top and looks awful. What's the best approach?

2 Answers

Kevin Niedermayr
Kevin Niedermayr
3,072 Points
Kevin Niedermayr
Kevin Niedermayr
3,072 Points

Well I haven't seen the actual course but have you tried to use:

footer {
position: absolute;
bottom: 0;
}

or some do it like that: 

footer {
    width:100%;
    height:80px;
    position:absolute;
    bottom:0;
}

It's always a bit tricky depending on what your content is or if you use some weird floating and stuff like that.

Anthony Hind
Anthony Hind
5,715 Points
Anthony Hind
Anthony Hind
5,715 Points

Hi if you look at the Twitter bootstrap documents here http://getbootstrap.com/getting-started/#examples there is a sticky footer option that forces the footer to the bottom of the page no matter how much content is on the page. the demo is here http://getbootstrap.com/examples/sticky-footer/

hope that helps