CSS
absolute・relative の違い
読み方：アブソリュート・レラティブ のちがい
relativeは元の位置を基準にずらす配置。absoluteは親要素を基準に自由に配置する。
やさしい説明
relativeは元の位置を基準にずらします。absoluteは親要素（positionが指定された）を基準に自由に配置します。
具体例・使い方
position: relative; top: 10px; → 元の位置から下に10pxずれる
position: absolute; top: 0; left: 0; → 親要素の左上に配置
absoluteを使うときは親にrelativeを付けるのがセット
よくある疑問
Q: absoluteを使うとき、親に何が必要？
A: 親要素にposition: relativeを指定します。これがないとページ全体が基準になります。
Q: relativeだけ指定して何も動かさないのはなぜ？
A: 子要素のabsoluteの基準点にするためです。よく使うテクニックです。
関連用語
📖 関連レッスン
レッスンを見る →