Containers

Stuff breakpoints and viewports sizes

DeviceExtra smallSmallMediumLargeExtra large
Breakpoint<576px≥576px≥768px≥992px≥1200px
Viewport100%540px720px960px1140px

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.