Containers
Stuff breakpoints and viewports sizes
| Device | Extra small | Small | Medium | Large | Extra large |
|---|---|---|---|---|---|
| Breakpoint | <576px | ≥576px | ≥768px | ≥992px | ≥1200px |
| Viewport | 100% | 540px | 720px | 960px | 1140px |
Example
Container
enable a centered viewport
<main class="container">
<h1>Hello, world!</h1>
<main>
Container Fluid
enable a 100% layout
<main class="container-fluid">
<h1>Hello, world!</h1>
<main>
<header>, <main> and <footer>as direct children of <body> provide a responsive verticalpadding
<section> provides a responsive margin-bottom to separate your sections.