Sizing
Easily make an element as wide (relative to its parent) with using the @outputclass="w-*"
utilities.
Additional Bootstrap extension width options @outputclass="w-*" available at 5% increments.
Width 5%
Width 10%
Width 15%
Width 20%
Width 30%
Width 35%
Width 40%
Width 45%
Width 55%
Width 60%
Width 65%
Width 70%
Width 80%
Width 85%
Width 90%
Width 95%
<p outputclass="w-5 p-3 bg-cream text-dark">Width 5%</p>
<p outputclass="w-10 p-3 bg-cream text-dark">Width 10%</p>
<p outputclass="w-15 p-3 bg-cream text-dark">Width 15%</p>
<p outputclass="w-20 p-3 bg-cream text-dark">Width 20%</p>
<p outputclass="w-30 p-3 bg-cream text-dark">Width 30%</p>
<p outputclass="w-35 p-3 bg-cream text-dark">Width 35%</p>
<p outputclass="w-40 p-3 bg-cream text-dark">Width 40%</p>
<p outputclass="w-45 p-3 bg-cream text-dark">Width 45%</p>
<p outputclass="w-55 p-3 bg-cream text-dark">Width 55%</p>
<p outputclass="w-60 p-3 bg-cream text-dark">Width 60%</p>
<p outputclass="w-65 p-3 bg-cream text-dark">Width 65%</p>
<p outputclass="w-70 p-3 bg-cream text-dark">Width 70%</p>
<p outputclass="w-80 p-3 bg-cream text-dark">Width 80%</p>
<p outputclass="w-85 p-3 bg-cream text-dark">Width 85%</p>
<p outputclass="w-90 p-3 bg-cream text-dark">Width 90%</p>
<p outputclass="w-95 p-3 bg-cream text-dark">Width 95%</p>