タグ: layout

CSS

CSS positionの使い方｜relative・absolute・fixed・stickyの違い

CSS positionのstatic・relative・absolute・fixed・stickyを実例で解説。基準となる包含ブロック、z-index、スクロール時の挙動、効かない原因とアクセシビリティ上の注意を整理します。

CSS

CSS calc()の使い方｜四則演算・CSS変数・clamp()との使い分け

CSS calc()で異なる単位を計算する方法を解説。四則演算の空白ルール、CSS変数との組み合わせ、固定ヘッダーを引く高さ、clamp()・min()・max()との使い分けを紹介します。

CSS

CSSのボックスモデルとbox-sizing｜widthがはみ出す原因を図解

CSSのcontent・padding・border・marginから成るボックスモデルとbox-sizingを解説。width:100%がはみ出す理由、border-boxの基本設定、DevToolsでの確認方法を紹介します。

Flutter

Flutter SizedBoxの使い方｜余白・固定サイズ・スペーサーの基本

FlutterのSizedBoxを初心者向けに解説します。固定サイズ、余白、Widget間のスペース、Containerとの違いを実装例で整理します。