---
fdRelatedComponents:
  - fd-container
  - fd-col
---

# Container

Layout containers used to arrange content on a 12-column grid. Can be used inside other layout containers like sections and panels.

## Default Container

<d-example name="0-container-default">
</d-example>

## Fluid Container
`fluid` overrides the `max-width` for a fluid layout with 100% of parent container.

<d-example name="1-container-fluid">
</d-example>

## Centered Container

<d-example name="2-container-centered">
</d-example>

## Fluid with Cols

This is a small playground which shows you how the fluid container behaves in different situations. Try adding/removing columns and the resize the window.

<d-example name="3-container-fluid-with-cols">
</d-example>

## Centered & Shifted Content

<d-example name="shifted-and-centered">
</d-example>
