title: Container storybookPath: page-layout-container--default isExperimentalPackage: false
The container centers and constrains the maximum width of the content it wraps.
<Container size="small">
<Placeholder height={64} />
</Container>
Examples
Size
Use the size
prop to adjust the maximum width of the container.
<Stack gap="large">
<Container size="xsmall">
<Placeholder label="xsmall" height={64} />
</Container>
<Container size="small">
<Placeholder label="small" height={64} />
</Container>
<Container size="medium">
<Placeholder label="medium" height={64} />
</Container>
<Container size="large">
<Placeholder label="large" height={64} />
</Container>
</Stack>