position: sticky; を調べた
position: sticky;を調べた。
position - CSS: カスケーディングスタイルシート | MDN
テーブル table タグのヘッダー行・列（th タグ）を固定する方法
[HTML]1 行目と 1 列目を固定表示する(position:sticky) – 偏差値 40 プログラマー
position: sticky の面白い使い方と使用時の注意点 | Rriver
absolute や fixed を使わないで要素を固定表示できる。
position: sticky が効かない場合の解決方法【CSS】 - termina.io
で、色々調べてたらどうやら祖先要素にoverflow: visible;以外の指定があると無効らしい。
これは信頼度がちょっと分からなくて、親要素にあるときはたしかに効かなかったけど、親より上にあった場合は大丈夫そうだった。
親要素がoverflow: scroll;とかだったときにこそ使いたいような気もするが、なんでだめなんだろうか……。
ライブラリもいくつかあった
でかでかと Deprecated と書いてある。
なんか jQuery っぽい。
Vue2 なら使えそう。
mehwww/vue-sticky-directive: A powerful vue directive make element sticky.
こちらも。ただ Nuxt で動かないみたいな Issue が。
ライブラリは全体的にちょっと人気がなさそう。vue-sticky-directive をちょっと調べてみたが、上下に固定することはできそうだが左右に固定することができなさそうだったりとちょっとまだ不便そうな感じもする。
IE で使えないとか色々あるし、もうちょっとなんとかなってほしい気持ち。