This example is for an older version of Bootstrap (v.4). A newer version is available for Bootstrap 5.

Find detailed documentation and more examples here:Go to Docs v5

Basic example

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

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.

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>