BS5 Containers

What is a container?

Containers are the most basic layout element in Bootstrap. They wrap your content and control horizontal alignment.

Fixed-width container

<div class="container">
  Content here
</div>

This container changes width at different breakpoints.

Fluid container

<div class="container-fluid">
  Full width content
</div>

This container always takes 100 percent width.

Responsive containers

<div class="container-sm"></div>
<div class="container-md"></div>
<div class="container-lg"></div>
<div class="container-xl"></div>
<div class="container-xxl"></div>

When to use each

• Use container for normal layouts
• Use container-fluid for full-width designs
• Use responsive containers for breakpoint control

Best practice

Always place rows inside containers for proper grid alignment.