Bootstrap including wrapping containers, a powerful grid system, a flexible media object, and responsive utility classes.
Containers are the most basic layout element in Bootstrap and are required when using our grid system. Choose from a responsive, fixed-width container (meaning its max-width changes at each breakpoint) or fluid-width (meaning it’s 100% wide).
Use .container-fluid for a full width container, spanning the entire width of the viewport.
These breakpoints are mostly based on minimum viewport widths and allow us to scale up elements as the viewport changes.
We occasionally use media queries that go in the other direction (the given screen size or smaller):
We also have media between the breakpoint’s minimum and maximum widths for only the given screen size:
And finally media that spans multiple breakpoint widths: