Additional Widths
Designed for use alongside Boostrap's containers, rows, and columns, our
.narrow, .medium, and .wide class provide
additional control of your layouts.
Narrow
Medium
Wide
Narrow
Narrow uses a CSS character width unit (ch) of 55, ideal for maximum readability of
paragraph text.
Place .narrow on block-level elements, like divs and sections — not
directly to text
elements
like headers and paragraph tags. This ensures narrow's width remains consistent, because
its
width is calculated from a single, base font-size (16px).
Medium
Medium's width is a multiple (1.25x) of narrow's width. Use .medium for
figures or any
content you wish to appear slightly wider than narrow.
Wide
Wide can be used on .container-fluid or any element (larger than container)
where you
wish to constrain the max width. Wide's with is set to 2400px by default.
Narrow, medium, and wide sizes can be customized. Their values are set in scss/_a-global-variables.scss under G. Additional widths, while their classes are declared in scss/_e-supplementary-classes.scss under B. Additional widths.