Bootstrap Containers

Bootstrap's Grid system is a powerful, mobile-first, flexbox grid that can be used to build responsive layouts of any kind. The grid is built on a twelve column system with five default responsive tiers. Like most grids, Bootstrap's grid system uses columns and rows, but the most important element is the container.

Containers are the most basic layout element in Bootstrap. Containers are required to use Bootstrap's default grid system. Containers are used to contain content and while it is possible to have nested containers, it is rarely required.

Bootstrap comes with three different containers:

• .container, which sets a max-width at each responsive breakpoint
• .container-fluid, which is width: 100% at all breakpoints
• .container-{breakpoint}, which is width: 100% until the specified breakpoint