Containers are used to align and center content.

In this article


Use .container to create a container with horizontal padding and, at larger screen sizes, maximum widths. They can be used to wrap any type of content.

Class Breakpoint Properties
.container None width: 100%;
  xs width: 100%;
  sm width: 100%;
  md width: 100%;
  lg max-width: 960px;
  xl max-width: 1140px;

Use .container-fluid to create a container that spans the full width of its container at all screen sizes.


When using the source Sass files, you can customize the maximum width of containers at various breakpoints:

$max-width-container: (
  lg: null,
  xl: 1280px

Questions or feedback about this article? Let us know