メモ:position:stickyについて

メモ:position:stickyについて

position:sticky、便利なんだけどちょくちょくうまく動かない事態が発生するのでメモ。

上部or側部のメニューバー的なものを追従させたいだけなら
nav{
width: 100%;
position: sticky;
top: 0;/*←任意の数値*/
}
で普通に動くよ。

親要素の中に同じレベルの子要素が他に何もなかったりするとダメらしい。
navならほかにfooterだの<div id=”main”>的なものがあるはずなのでこれで動きます。
これで動かない事態になったらまた追記しとく。

メモカテゴリの最新記事