Layout

Containers

Use .quanta-container to wrap content in a responsive container with consistent horizontal padding and adaptive max-widths.

<div class="quanta-container">
  <p>This content is inside a responsive container.</p>
</div>

Fluid Container

Use .quanta-container-fluid for full-width containers with consistent horizontal padding.

<div class="quanta-container-fluid">
  <p>This content stretches the full width of the screen with padding.</p>
</div>

No Padding

Use .quanta-container-no-padding to remove default horizontal padding from the container.

<div class="quanta-container quanta-container-no-padding">
  <p>This container has no horizontal padding.</p>
</div>