Available breakpoints
| Breakpoint | Class infix | Dimensions |
|---|---|---|
| X-Small | None | <576px |
| Small |
sm
|
≥576px |
| Medium |
md
|
≥768px |
| Large |
lg
|
≥992px |
| Extra large |
xl
|
≥1200px |
| Extra extra large |
xxl
|
≥1400px |
Containers
|
Extra small <576px |
Small ≥576px |
Medium ≥768px |
Large ≥992px |
X-Large ≥1200px |
XX-Large ≥1400px |
|
|---|---|---|---|---|---|---|
.container
|
100% | 540px | 720px | 960px | 1140px | 1320px |
.container-sm
|
100% | 540px | 720px | 960px | 1140px | 1320px |
.container-md
|
100% | 100% | 720px | 960px | 1140px | 1320px |
.container-lg
|
100% | 100% | 100% | 960px | 1140px | 1320px |
.container-xl
|
100% | 100% | 100% | 100% | 1140px | 1320px |
.container-xxl
|
100% | 100% | 100% | 100% | 100% | 1320px |
.container-fluid
|
100% | 100% | 100% | 100% | 100% | 100% |
Grid options
|
xs <576px |
sm ≥576px |
md ≥768px |
lg ≥992px |
xl ≥1200px |
xxl ≥1400px |
|
|---|---|---|---|---|---|---|
Container max-width
|
None(auto) | 540px | 720px | 960px | 1140px | 1320px |
| Class prefix |
.col-
|
.col-sm-
|
.col-md-
|
.col-lg-
|
.col-xl-
|
.col-xxl-
|
| # of columns | 12 | |||||
| Gutter width | 1.5rem(.75rem on left and right) | |||||
| Custom gutters | Yes | |||||
| Nestable | Yes | |||||
| Column ordering | Yes | |||||