See how the tk-bootstrap patterns grid is different from the original bootstrap grid
Small devices Phones (<=768px) | Large devices Desktops (>768px) | |||
---|---|---|---|---|
Grid behavior | Horizontal at all times | Collapsed to start, horizontal above breakpoints | ||
Container width | None (auto) | 1284px | ||
Class prefix | .col-xs- |
.col-lg- |
||
# of columns | 12 | |||
Column width | Auto | 87px | ||
Gutter width | 20px (10px on each side of a column) | |||
Nestable | Yes | |||
Offsets | Yes | |||
Column ordering | Yes |
See how aspects of the Bootstrap grid system work across multiple devices with a handy table.
Extra small devices Phones (<768px) | Small devices Tablets (>=768px) | Medium devices Desktops (>=992px) | Large devices Desktops (>=1200px) | |
---|---|---|---|---|
Grid behavior | Horizontal at all times | Collapsed to start, horizontal above breakpoints | ||
Container width | None (auto) | 750px | 970px | 1170px |
Class prefix | .col-xs- |
.col-sm- |
.col-md- |
.col-lg- |
# of columns | 12 | |||
Column width | Auto | 60px | 78px | 95px |
Gutter width | 30px (15px on each side of a column) | |||
Nestable | Yes | |||
Offsets | Yes | |||
Column ordering | Yes |