Problem
I have the following straightforward code:
The div, however, does not appear when the height is set to 100%. Why?
Asked by strangeQuirks
Solution #1
All of your parent elements, in this example your body and html, must be set to 100% height. This violin demonstrates how it works.
Answered by Jan Dragsbaek
Solution #2
Make it the full height of the viewport:
div {
height: 100vh;
}
For additional information, click here. Works in all modern browsers and Internet Explorer >=9.
Answered by mb21
Solution #3
If you give the parent element a fixed size, height: 100% will work.
Answered by GG.
Solution #4
This can be accomplished through the use of placement.
Try
position: absolute;
to achieve a height of one hundred percent
Answered by Muthu
Solution #5
The parent element’s height must be set to 100 percent.
Answered by rahul
Post is based on https://stackoverflow.com/questions/8262852/css-height-in-percent-not-working