Why does height not accept percentage?

I believe this will solve your problem. The height percentage can only be obtained if it is relative to the other elements that contain these divisions. You have to determine how the upper blocks should behave relative to the height.

html, 
body  {
    height: 100%;
    margin: 0px;
    padding: 0px;
}

#dv1 {
    width : 100%;
    height : 50%;
    background-color : red;
}

#dv2 {
    width : 100%;
    height : 50%;
    background-color : green;
}

<div id="dv1"></div>
<div id="dv2"></div>

When you place a size in percent, the value is calculated based on the size of the parent element. With this in mind, it is interesting to note that by default, there is no defined height in a blank (or even content) site. To see this, use the Inspect element and you see in the body tag there is a width, but the height is 0 (it increases according to the content of the site) / p>

To change this, the technique is simply to define a value for body and html :

body, html {
    height: 100%;
}

After this, elements with a percentage size will have their values calculated correctly (previously they were calculated with 0).

Height accepts percentage yes.

Look at an example:

#tudo {
  width: 300px;
  height:300px;
}

.bloco-vermelho {
  width: 100%;
  height: 50%;
  background-color: red;
}
.bloco-verde {
  width: 100%;
  height: 50%;
  background-color: green;
}

<div id="tudo">
<div class="bloco-vermelho">
</div>
<div class="bloco-verde">
</div>
  </div>

You can go back to your code and see if there is a semicolon at the end, as it is a common failure to apply CSS.