Container

A max-width wrapper that centres content and applies a responsive side gutter. The default width is 900px (--container). Use modifiers to switch to narrower or wider tracks.

Variants

<!-- Default: 900px centred -->
<div class="ln-container border p-2 mb-3">
  <p>Default — max-width 900px, centred with gutter padding.</p>
</div>

<!-- Narrow: 70ch prose measure -->
<div class="ln-container ln-container--narrow border p-2 mb-3">
  <p>Narrow — prose measure (~70ch), ideal for long-form reading.</p>
</div>

<!-- Wide: 1200px -->
<div class="ln-container ln-container--wide border p-2 mb-3">
  <p>Wide — 1200px maximum width for data-rich layouts.</p>
</div>

<!-- Full: no max-width -->
<div class="ln-container ln-container--full border p-2 mb-3">
  <p>Full — no max-width constraint.</p>
</div>

<!-- Flush: no side padding -->
<div class="ln-container ln-container--flush border p-2">
  <p>Flush — zero inline padding.</p>
</div>

Default — max-width 900px, centred with gutter padding.

Narrow — prose measure (~70ch), ideal for long-form reading.

Wide — 1200px maximum width for data-rich layouts.

Full — no max-width constraint.

Flush — zero inline padding.

Reference

Class	Description	Responsive
`.ln-container`	Centred wrapper, max-width 900px with gutter padding	No
`.ln-container--narrow`	Prose measure width (~70ch)	No
`.ln-container--wide`	Wide track (1200px)	No
`.ln-container--full`	No max-width constraint	No
`.ln-container--flush`	Zero inline padding	No