サイズ制御クラス -max-sz:

Lismには、コンテンツサイズ用のトークンとして--sz--{sz}が用意されています、（{sz} = xs, s, m, l, xl）

コンテンツの最大幅（max-inline-size)指定用の -max-szクラスに対して、それぞれユーティリティクラスが用意されています。

-max-sz:{xs~xl}はそのまま--sz--{xs~xl}がセットされるクラスです。

さらに、以下のような特徴的なクラスがありますのでそれらを紹介しておきます。

クラス名	説明
-max-sz:100%	単純に、100%幅が最大値となります。
-max-sz:full	.has--gutterの直下であれば、100%サイズにその余白を追加して、親要素のサイズいっぱいに広がります。
-max-sz:container	コンテナ要素を基準としたサイズまで広がります。.is-containerクラスごとに、値が更新されます。（@propetryを使っています。）

これらの-max-szクラスの挙動について、別ページで確認できますのでぜひご覧ください。

大きい画面で見る