CSS CSS Layout Basics Getting Started with CSS Layout Creating a Sticky Footer

Daniel DeBono
Daniel DeBono
2,056 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

1 Answer

KRIS NIKOLAISEN
PRO
KRIS NIKOLAISEN
Pro Student 49,702 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);