CSS note-to-self: `position:fixed;` is not respected within transformed block elements
Note to self:
position:fixed; is not respected if the fixed element is within a transformed element.
See a very old meyerweb.com article on the topic. Apparently this is expected behaviour, not a bug, hence why people are still encountering this funkiness nine years after Eric Meyer’s article. As he suggests, it’s a little counter-intuitive!
In my case, it related to a fixed element within a
<div> that was being transitioned from off screen to on the screen. I was able to get around it by reversing the transform so that when the element needed to be fixed, I set the containing element to
transform: none;. That wouldn’t work in every case though, so YMMV.