pushable breaks children that has position: fixed, making them scrollable

[kevinresol]

Bug Report

pushable breaks children that has position: fixed in a way that they are no longer fixed relative to window but relative to the pushable itself

Steps to reproduce

1. Have a position: fixed element inside pushable

Expected result

position: fixed elements should be fixed relative to window, regardless of scrolling of any other elements

Actual result

position: fixed element (itself, not its children) become scrollable somehow

Reason

pushable has a transform: translate3d(0, 0, 0); according to https://stackoverflow.com/a/37953806/3212365

Testcase

https://jsfiddle.net/wkoerjs7/1/

1. click "Click Me" to toggle the position: fixed of the box (red=fixed, green=not fixed)
2. check that the fixed box is scrollable with the parent, but fixed element should be fixed relative to window

Version

2.8.7

[ko2in]

Someone has already asked the similar issue and there is solution explained.

[kevinresol]

I think none of the solution works...

1. For me it is not viable to move the element to root
2. inline-block does create a new block context, but itself is still scrollable. So if the inline-block is scrolled, any fixed children in it will also move and are no longer "fixed to window"
3. overflow doesn't work too because my other contents are scrollable

[ko2in]

@kevinresol Maybe this should work for you (https://jsfiddle.net/ko2in/hs7a540L/10/).

[kevinresol]

thanks very much!