「position: fixed;を使って画面に固定したいのになぜかできない…absoluteみたいな配置になってしまう」という現象でハマりました… というわけで、position: fixedが効かない原因と対処法を紹介します。 position: fixedが効かない原因親要素にtransformを指定していませんか? 親要素にtransformを指定しているとposition: fixed;を指定しても背景画像が固定されず、表示が崩れます。こいつが原因ですね。 特に<body>にtransform: translate3d(0, 0, 0);を指定してる人(もしくはtransform: translateZ(0);)や、ハンバーガメニュー、モーダルなどを実装しようとしている人は注意しましょう。 jQueryで色々操作していると案外気づかなかったりしますからね。これ結構ハマりポイントで
![【CSS】position: fixedが効かない場合の原因と対処法](https://cdn-ak-scissors.b.st-hatena.com/image/square/b1149ea9624d8fd64b3cd1b119fb50fe3cdf70cc/height=288;version=1;width=512/https%3A%2F%2Fdezanari.com%2Fwp-content%2Fuploads%2F2020%2F02%2F24b90323986ca1e3260e61d80975b7aa.jpg)