class container bootstrap code example
Example 1: bootstrap container-fluid
Use .container-fluid for a full width container, spanning the entire width of the viewport.
<div class="container-fluid">
...
</div>
Example 2: container in bootstrap
Containers
Containers are the most basic layout element in Bootstrap and are required when using our default 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 all the time).
While containers can be nested, most layouts do not require a nested container.
Syntax:
<div class="container">
</div>
Example 3: container bootstrap
<div class="container-sm">100% wide until small breakpoint</div>
<div class="container-md">100% wide until medium breakpoint</div>
<div class="container-lg">100% wide until large breakpoint</div>
<div class="container-xl">100% wide until extra large breakpoint</div>
Example 4: bootstrap container
Our default .container class is a responsive, fixed-width container, meaning its max-width changes at each breakpoint.
<div class="container">
</div>
Example 5: bootstrap container width
--------------------------------------------------------------------------------------
Bootstrap Container Width | Size | Class Prefix
--------------------------------------------------------------------------------------
Extra small devices Phones (less than 768px) | None (auto) | .col-xs-
Small devices Tablets (greater than equals 768px) | 750px | .col-sm-
Medium devices Desktops (greater than equals 992px) | 970px | .col-md-
Large devices Desktops (greater than equals 1200px) | 1170px | .col-lg-
Example 6: container class in bootstrap
meaning it’s 100% wide all the time