Footer positioning. Plz help | Sololearn: Learn to code for FREE!
New course! Every coder should learn Generative AI!
Try a free lesson
0

Footer positioning. Plz help

HTML: <footer></footer> CSS: body{ position:relative; min-height:100vh; } footer{ position:absolute; background-color:#000; bottom:0; width:100%; height:10vh; } There is more code, but this is where the problem lies. The footer is displayed two thirds of the way down on the page. The body is the parent of the footer. Any fix?

28th Aug 2020, 11:17 PM
Jeremy Cruz
Jeremy Cruz - avatar
6 Answers
28th Aug 2020, 11:36 PM
BroFar
BroFar - avatar
+ 4
Jeremy Cruz if you look at my code you will see min-height as well as max-height
28th Aug 2020, 11:57 PM
BroFar
BroFar - avatar
+ 2
Maybe since the actual viewport height is more than window height you need to set min-height for body to 97vh or so ,hope it helps if I understood your problem right
28th Aug 2020, 11:24 PM
Abhay
Abhay - avatar
+ 2
There is one thing I found ,you can set body min-height to calc(100vh - 16px)
28th Aug 2020, 11:56 PM
Abhay
Abhay - avatar
0
nope, didn’t work
28th Aug 2020, 11:27 PM
Jeremy Cruz
Jeremy Cruz - avatar
0
why does the min-height change the outcome?
28th Aug 2020, 11:41 PM
Jeremy Cruz
Jeremy Cruz - avatar