{% extends "partials/base.html" %} {% load static %} {% block title %}Grid System{% endblock title %} {% block extra_css %} {% endblock extra_css %} {% block pagetitle %} {% include "partials/page-title.html" with pagetitle="Base UI" title="Grid System" %} {% endblock pagetitle %} {% block content %}
See how aspects of the Bootstrap grid system work across multiple devices with a handy table.
Extra small <576px |
Small ≥576px |
Medium ≥768px |
Large ≥992px |
Extra large ≥1200px |
Extra large ≥1400px |
|
---|---|---|---|---|---|---|
Max container 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.25rem (0.625rem on each side of a column) | |||||
Custom gutters | Yes | |||||
Nestable | Yes | |||||
Column ordering | Yes |