0

I have some simple CSS and I don't know why it isn't working. It uses percentages and I have labeled both and I still don't understand why it works. Here's the code

.BoxHeight {
height: 100%;
}

#Box {
  margin-top: 0%;
  margin-left: 3%;
  width: 90%;
  height: 80%;
  background-color: red;
  }
<div class="BoxHeight">
<div id="Box"></div>
</div>
Hanlet Escaño
  • 17,114
  • 8
  • 52
  • 75
Ilo
  • 1
  • 3

2 Answers2

2

You need to add height to the body.

html, body {
    height: 100%; 
    width: 100%; 
}
M0ngi
  • 184
  • 1
  • 9
0

Do "BoxHeight" have a parent ? Be cause if no, or the parent is a default body, it will have a height of 0. You must give a diffined Height, using px for exemple, and the "Box" will have 80% of this height.