Container

主要なコンテンツ幅を管理するためのコンポーネントです。

レイアウト

指定された大きさを保ちながら、左右中央に配置されます。コンテナの大きさよりウィンドウ幅が小さい場合は、パディングを保ちながらコンテナの幅が狭くなります。

コンテナの大きさ

size props を使ってコンテナの大きさを指定できます。デフォルトはDEFAULTです。

大きさ幅トークン値(px)
NARROWcol6880px
DEFAULTcol81184px
WIDEcol91336px
FULL-width: 100%

コンテナのパディング

padding props を使ってコンテナのパディングを指定できます。

デフォルトで上下左右2文字ずつのパディングが設定されています。モバイルレイアウトの場合は上下1.5文字、左右1文字ずつのパディングが設定されます。いずれの値も上書きできます。

Props

Propsは設定されていません。

関連リンク