position: sticky の落とし穴

今日はレイアウトで1時間はまりました。サイドバーの position: sticky がどうしても効かないのです。

調べたところ、原因は定番でした。祖先要素のどれかに overflow: hidden（auto や scroll でも）を設定すると、sticky はスクロールできるコンテキストを必要とするため効かなくなります。

確認チェックリスト

1. sticky 要素自身に top（や bottom など）のしきい値があること
2. 親の連鎖に non-visible な overflow がないこと
3. 親要素の高さが十分にあること——なければ「貼り付く」余地がない

書き留めておけば、次からは一度で済みます。