---
title: Container
description: PaperCSS Container
---

The container is usually at the root of the HTML and holds all of the content in a fixed size. PaperCSS supports a few
different sizes to make setting your content within a certain max-width easy. Don't forget to add the `.paper` class to
give you site some extra paper flair!

<div class='paper container margin-bottom-large'>
  <h4>Responsive Container!</h4>
  <p>The default</p>
  <p>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras lorem lectus, lobortis a nibh non, luctus luctus
    erat posuere. Curabitur ac turpis aliquam, malesuada elit suscipit, blandit dolor.
  </p>
</div>

<div class='paper container container-lg margin-bottom-large'>
  <h4>Large Container!</h4>
  <p>Using <code>container-lg</code><p>
  <p>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras lorem lectus, lobortis a nibh non, luctus luctus
    erat posuere. Curabitur ac turpis aliquam, malesuada elit suscipit, blandit dolor.
  </p>
</div>

<div class='paper container container-md margin-bottom-large'>
  <h4>Medium Container!</h4>
  <p>Using <code>container-md</code><p>
  <p>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras lorem lectus, lobortis a nibh non, luctus luctus
    erat posuere. Curabitur ac turpis aliquam, malesuada elit suscipit, blandit dolor.
  </p>
</div>

<div class='paper container container-sm margin-bottom-large'>
  <h4>Small Container!</h4>
  <p>Using <code>container-sm</code><p>
  <p>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras lorem lectus, lobortis a nibh non, luctus luctus
    erat posuere. Curabitur ac turpis aliquam, malesuada elit suscipit, blandit dolor.
  </p>
</div>

<div class='paper container container-xs margin-bottom-large'>
  <h4>Extra Small Container!</h4>
  <p>Using <code>container-xs</code><p>
  <p>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras lorem lectus, lobortis a nibh non, luctus luctus
    erat posuere. Curabitur ac turpis aliquam, malesuada elit suscipit, blandit dolor.
  </p>
</div>