Sizing

Width

<div class="bg-primary text-white p-3 w-25">Width 25%</div>
<div class="bg-primary text-white p-3 w-50">Width 50%</div>
<div class="bg-primary text-white p-3 w-75">Width 75%</div>
<div class="bg-primary text-white p-3 w-100">Width 100%</div>
<div class="bg-primary text-white p-3 w-auto">Width auto</div>

Height

<div class="bg-primary text-white p-3 h-25">Width 25%</div>
<div class="bg-primary text-white p-3 h-50">Width 50%</div>
<div class="bg-primary text-white p-3 h-75">Width 75%</div>
<div class="bg-primary text-white p-3 h-100">Width 100%</div>
<div class="bg-primary text-white p-3 h-auto">Width auto</div>

Max-height and max-width

You can set the max height and max width to 100% as easy.

<div class="bg-light mb-1" style="height: 100px;">
    <div style="height: 200px; width: 200px;" class="bg-primary text-white mh-100">Max-height 100%</div>
</div>

<div class="bg-light" style="height: 100px; width: 200px;">
    <div style="height: 50px; width: 500px;" class="bg-primary text-white mw-100">Max-width 100%</div>
</div>

Sizing relative to viewport

<div class="min-vw-100">Max-height 100vw</div>
<div class="min-vh-100">Max-width 100vh</div>
<div class="vw-100">Height 100vw</div>
<div class="vh-100">Width 100vh</div>