Layout Helpers
These modular elements can be readily used and customized in every layout across pages.
For more Details see Bootstrap Sizing Documentation⟶
Easily make an element as wide or as tall (relative to its parent) with our width and height utilities. Includes support for 25%
, 50%
, 75%
, and 100%
by default.
.w-100
.w-75
.w-50
.w-25
.h-100
.h-75
.h-50
.h-25
Special height classes
Height utilities that apply to all breakpoints, from xs
to xl.
The classes are named using the format {property}-{size}
for xs
and {property}-{breakpoint}-{size}
for sm
,
md
, lg
and xl
. Example: .mh-100vh
or .mh-md-100vh
The properties are following:
.mh-100vh { max-height: 100vh; }
.mh-75vh { max-height: 75vh; }
.mh-50vh { max-height: 50vh; }
.mh-25vh { max-height: 25vh; }
.minh-100vh { min-height: 100vh; }
.minh-75vh { min-height: 75vh; }
.minh-50vh { min-height: 50vh; }
.minh-25vh { min-height: 25vh; }
.h-100vh { height: 100vh !important; }
.h-75vh { height: 75vh !important; }
.h-50vh { height: 50vh !important; }
.h-25vh { height: 25vh !important; }