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 CSS Layout Basics Getting Started with CSS Layout Creating a Sticky Footer

Daniel DeBono
Daniel DeBono
3,067 Points
Posted by Daniel DeBono
Daniel DeBono
3,067 Points

Footer not sticking to the bottom of the page

Quite a frustrating afternoon with evidence of other students using the 'wrap' div and applying the relevant 'min-height' and 'vh' properties to it as per instruction, specifically when I followed that exact instruction and did not get the same result :/ Even went as far as using another browser for wider support (opera -> chrome).

Here's my work, if anyone could show me what I did wrong, it would be much appreciated. :0

https://w.trhou.se/axbmlrk0q9

2 Answers

KRIS NIKOLAISEN
KRIS NIKOLAISEN
54,972 Points

If you look at the styles in developer tools you'll see

min-height: calc(100vh-89px);

lined out due to an invalid property value. Adding spaces around the minus sign fixes this:

min-height: calc(100vh - 89px);
Amber Stevens
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
Amber Stevens
Treehouse Project Reviewer
Amber Stevens
.a{fill-rule:evenodd;}techdegree seal-36
Amber Stevens
Treehouse Project Reviewer

KRIS NIKOLAISEN I'm so glad you posted this, because I was copying what Guil does in the video and my footer wasn't sticking to the bottom. So I was scratching my head at this one. And wouldn't you know it? What it came down to for me was adding another space after the minus sign! Thanks!