Sizing
Easily make an element as wide or as tall with our width and height utilities.
Sizing on TailwindWidth (relative to parent)
<div class="bg-body-highlight p-2 border-dashed mb-4 w-full"><code>.w-full</code></div>
<div class="bg-body-highlight p-2 border-dashed mb-4 w-3/4"><code>.w-3/4</code></div>
<div class="bg-body-highlight p-2 border-dashed mb-4 w-1/2"><code>.w-1/2</code></div>
<div class="bg-body-highlight p-2 border-dashed mb-4 w-1/4"><code>.w-1/4</code></div>
<div class="bg-body-highlight p-2 border-dashed mb-4 w-auto"><code>.w-auto</code></div>
.w-full.w-3/4.w-1/2.w-1/4.w-autoHeight (relative to parent)
<div class="h-[50vh] py-4">
<div class="row h-full">
<div class="col">
<div class="bg-body-highlight p-2 border-dashed mb-4 h-full"><code>.h-full</code></div>
</div>
<div class="col">
<div class="bg-body-highlight p-2 border-dashed mb-4 h-3/4"><code>.h-3/4</code></div>
</div>
<div class="col">
<div class="bg-body-highlight p-2 border-dashed mb-4 h-1/2"><code>.h-1/2</code></div>
</div>
<div class="col">
<div class="bg-body-highlight p-2 border-dashed mb-4 h-1/4"><code>.h-1/4</code></div>
</div>
<div class="col">
<div class="bg-body-highlight p-2 border-dashed mb-4 h-auto"><code>.h-auto</code></div>
</div>
</div>
</div>
.h-full.h-3/4.h-1/2.h-1/4.h-auto
