Dialtone

Min-height

Utilities to control an element's minimum height.

Classes

ClassOutput
.d-hmn10pmin-height: 10% !important;
.d-hmn20pmin-height: 20% !important;
.d-hmn25pmin-height: 25% !important;
.d-hmn30pmin-height: 30% !important;
.d-hmn40pmin-height: 40% !important;
.d-hmn50pmin-height: 50% !important;
.d-hmn60pmin-height: 60% !important;
.d-hmn70pmin-height: 70% !important;
.d-hmn75pmin-height: 75% !important;
.d-hmn80pmin-height: 80% !important;
.d-hmn90pmin-height: 90% !important;
.d-hmn100pmin-height: 100% !important;
.d-hmn0min-height: 0px !important;
.d-hmn1min-height: 1px !important;
.d-hmn2min-height: 2px !important;
.d-hmn4min-height: 4px !important;
.d-hmn6min-height: 6px !important;
.d-hmn8min-height: 8px !important;
.d-hmn12min-height: 12px !important;
.d-hmn16min-height: 16px !important;
.d-hmn24min-height: 24px !important;
.d-hmn32min-height: 32px !important;
.d-hmn42min-height: 42px !important;
.d-hmn48min-height: 48px !important;
.d-hmn64min-height: 64px !important;
.d-hmn72min-height: 72px !important;
.d-hmn84min-height: 84px !important;
.d-hmn96min-height: 96px !important;
.d-hmn102min-height: 102px !important;
.d-hmn114min-height: 114px !important;
.d-hmn128min-height: 128px !important;
.d-hmn164min-height: 164px !important;
.d-hmn216min-height: 216px !important;
.d-hmn264min-height: 264px !important;
.d-hmn332min-height: 332px !important;
.d-hmn464min-height: 464px !important;
.d-hmn512min-height: 512px !important;
.d-hmn628min-height: 628px !important;
.d-hmn764min-height: 764px !important;
.d-hmn828min-height: 828px !important;
.d-hmn912min-height: 912px !important;
.d-hmn1024min-height: 1024px !important;
.d-hmn1140min-height: 1140px !important;
.d-hmn1268min-height: 1268px !important;
.d-hmn1340min-height: 1340px !important;
.d-hmn-automin-height: auto !important;
.d-hmn-unsetmin-height: unset !important;

Percentages

Use d-hmn{n}p to set a minimum height percentage for an element. This can be combined with d-h{n}p and d-hmx{n} to have an element fill a certain height range.

<div class="d-h216">
    <div class="d-hmn100p">1</div>
</div>

Fixed

Use d-hmn{n} to set a fixed minimum height for an element. This can be combined with d-h{n}p and d-hmx{n} to have an element fill a certain height range.

<div class="d-hmn64">1</div>
<div class="d-hmn96">2</div>
<div class="d-hmn332">3</div>
Last Updated: