Typography

grid system

One of three columns

One of three columns

One of three columns

grid Options

	Extra small <576px	Small ≥576px	Medium ≥768px	Large ≥992px	Extra large ≥1200px
Max container width	None (auto)	540px	720px	960px	1140px
Class prefix	`.col-`	`.col-sm-`	`.col-md-`	`.col-lg-`	`.col-xl-`
# of columns	12
Gutter width	30px (15px on each side of a column)
Nestable	Yes
Column ordering	Yes

Equal width

1 of 2

2 of 2

1 of 3

2 of 3

3 of 3

Column

Column

Column

Column

1 of 3

2 of 3 (wider)

3 of 3

1 of 3

2 of 3 (wider)

3 of 3

Variable width content

1 of 3

Variable width content

3 of 3

1 of 3

Variable width content

3 of 3

Responsive classes

All Break Points

col

col

col

col

col-8

col-4

Stacked to horizontal

col-sm-8

col-sm-4

col-sm

col-sm

col-sm

Mix and Match

.col-12 .col-md-8

.col-6 .col-md-4

.col-6 .col-md-4

.col-6 .col-md-4

.col-6 .col-md-4

.col-6

.col-6

Alignment

Vertical Alignment

One of three columns

One of three columns

One of three columns

One of three columns

One of three columns

One of three columns

One of three columns

One of three columns

One of three columns

One of three columns

One of three columns

One of three columns

Horizontal Alignment

One of two columns

One of two columns

One of two columns

One of two columns

One of two columns

One of two columns

One of two columns

One of two columns

One of two columns

One of two columns