AIへの指示で詰まりやすいレイアウト用語
このページでは、AIへの指示で使うと伝わりやすくなるレイアウト・配置系のCSS用語を解説します。知らないとAIへの指示が遠回りになる用語を厳選しています。
「なんか横に並べて」「上に固定して」——曖昧な指示でもAIは動いてくれますが、 正しい用語を使うと一発で意図が伝わります。 このページでは、レイアウト指示でよく使う用語を厳選して解説します。
Flexbox（フレックスボックス）
要素を横・縦に柔軟に並べるレイアウト方式
AIへの指示例
「Flexboxで横並びにして、右端だけ右寄せにして」Grid（グリッド）
行と列で要素を格子状に配置するレイアウト方式
AIへの指示例
「Gridで3カラムのカード一覧を作って」position: sticky
スクロールしても画面内の特定位置に留まる配置
AIへの指示例
「ヘッダーをstickyにしてスクロール追従させて」position: fixed
画面全体に対して固定される配置（スクロールに影響されない）
AIへの指示例
「FABをfixedで右下に固定して」position: absolute
親要素を基準にした絶対配置
AIへの指示例
「バッジをアイコンの右上にabsoluteで重ねて」z-index
要素の重なり順を数値で指定する
AIへの指示例
「モーダルがヘッダーより前に出るようz-indexを調整して」コンテナ / ラッパー（Container / Wrapper）
コンテンツを囲んで幅や余白を制御する外側の要素
AIへの指示例
「コンテナの最大幅を1200pxにして中央揃えにして」