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
Kristjan Vingel
7,992 PointsThis doesn't work
Am I doing something wrong? I still have the vertical scroll.
The whole calc thing looks an incredibly hacky solution and not elegant at all. Is there a more simple solution - even if it means more CSS code?
I'm no CSS expert but even for me - if I need to start calculating with numbers inside the CSS file - it doesn't look right.
Please tell me I'm not right...
2 Answers
Steven Parker
231,275 PointsIt looks right to me. I don't see a vertical scroll bar unless I make the window too short for the content to fit.
But this isn't the only way to stick a footer at the bottom of the window. There's another technique using "position: fixed;" and "bottom: 0;" that will do it without the calculation (but the scrolling works differently).
Kristjan Vingel
7,992 PointsI got it to work by replacing 89 with 112px on the .wrap class. But again, I have a feeling that on different screens this might break. I'm using a 1920x1080 resolution on a 12.5 inch display.
I also got it to work by adding the following to the .main-footer:
.main-footer { position: fixed; bottom: 0; width: 100%; }
I had to add the width, otherwise the footer gets pushed to the left for some reason.
Thanks again Steven!
Kara Caputo
2,213 PointsThank you! I was having the same issue.