Page Navigation:

Sizing


Relative to parent

Width

Width 25%
Width 50%
Width 75%
Width 100%

Height

Height 25%
Height 50%
Height 75%
Height 100%

Max width and height

Max-width

Max-width = 100%

Max-height

Max-height = 100%

Relative to viewport

Width

Width 100vw

Min-width

Min-width 100vw

Height

Height 100vh

Min-height

Min-height 100vh

Column classes

Parent element must be a block-level element (display: block;)

All breakpoints

Width 1/12
Width 1/6
Width 1/4
Width 1/3
Width 5/12
Width 1/2
Width 7/12
Width 2/3
Width 3/4
Width 5/6
Width 11/12
Width 1/1

Responsive

Example: XS: 1/6, SM: 1/3, MD: 1/2, LG: 2/3, XL: 5/6, XXL: 1/1

Example