フロントエンドカンファレンス北海道2025
レギュラートーク(20分)
CSSレイアウト再入門:Intrinsic Size - コンテンツに基づく寸法
berlysia
berlysia
CSSにおけるレイアウトは、ボックスをどのように並べるかという営みです。
FlexboxやGridは、枠組みを決めてから余白を分け合う、外側からのアプローチです。
一方、実際のWebコンテンツのレイアウトをしていると、コンテンツに基づく寸法、Intrinsic Sizeの姿が浮かび上がります。
Intrinsic Sizeの周りの寸法は min-content max-content fit-content() といった表現で参照できるようにもなっており、
Interop 2024の結果、FlexboxやGridの主要ユースケースを満たすようになりました。
周辺で生じる問題の個別対策テクニックから一歩進んだ理解をつかみ、
外側ばかりでなく内側からも、勘ではなく論理で捉えるレイアウト力を身につけましょう。
対象：中級〜リーダー級