You can use Bootstrap sizing classes to set height or width of the div (or any other element).

Note: The height of the div (or any other element) will be relative to the height of its parent. That means if you set 100px height to the parent of the div, and then you will set the height of the chold div to 50%, the child div will be 50px height.

Detailed documentation and more examples you can find in our Bootstrap Sizing Docs


Basic example

The red div below is 100px width and all the child element are relative to it.

Height 25%
Height 50%
Height 75%
Height 100%
Height auto

      <div style="height: 100px; background-color: rgba(255,0,0,0.1);">
        <div class="h-25 d-inline-block">Height 25%</div>
        <div class="h-50 d-inline-block">Height 50%</div>
        <div class="h-75 d-inline-block">Height 75%</div>
        <div class="h-100 d-inline-block">Height 100%</div>
        <div class="h-auto d-inline-block">Height auto</div>
      </div>