Container
A fixed-width, centered container: size maps to --oas-container-* width tokens, margin-inline: auto centers it (logical property, RTL-compliant automatically), and max-width: min(100%, token) prevents overflow on narrow screens.
Basic usage
Default lg centered
Sizes
size has six tiers: xs（480）/ sm（576）/ md（768）/ lg（992）/ xl（1200）/ full（100%）. The container uses a hover background color to mark its actual width.
Six size tiers
Disable centering
With center="false" centering is disabled (margin-inline: 0) and the container hugs the start of the line (the left side in LTR).
center=false
Padding
padding accepts any token/value and applies to padding-inline (logical padding).
padding
Empty container
An empty container causes no error and takes no placeholder.
Empty container
API
Attributes
| Attribute | Description | Type | Default |
|---|---|---|---|
center | Whether to center (center="false" disables) | string | true |
padding | Padding token/value (applies to padding-inline) | — | — |
size | Fixed-width tier, mapped to --oas-container-* tokens | string | lg |
Slots
| Name | Description |
|---|---|
| default | — |