Basic height percentage

Question

I don\'t understand how height percentages work.

Why is the following snippet not filled with color?

Answer 1

You need to set height: 100% to as well:

html,body {
    height:100%;
}

#div1 {
    height: 20%;
    background-color: red;
}

#div2 {
    height: 80%;
    background-color: blue;
}