CSSのpositionプロパティには、stickyとfixedの2つがあります。
- position:stickyは、スクロールした時に要素が画面上に固定されるようになります。スクロールする前には通常通りに配置され、特定の位置に到達した時に固定されるようになります。
- position:fixedは、スクロールに関係なく常に画面上に固定されるようになります。スクロールしてもその位置が変わらないため、スクロールに影響を与えない固定ヘッダーなどに使われます。
stickyは、スクロールによって要素の位置が動くのに対して、fixedはスクロールに関係なく要素の位置を固定することができることが違いです。