z-index not respected in polyfill

[dlerman]

Thanks for this great project!

Quick question: with native sticky positioning, it looks like z-index is respected even when the element is unstuck. Mozilla docs say "Sticky positioning is a hybrid of relative and fixed positioning.", both of which respect z-order.

However, in the polyfill implementation, it toggles between static and fixed positioning (rather than relative and fixed), and the static positioning ignores z-index.

So, if you have a sticky element positioned on top of a background element, the native version will show it correctly, but the polyfill will only show it when stuck.

Is there a reason for using static in the polyfill rather than relative?

[zachleat]

Not really, no, other than we’d have to add a bit more CSS to reset top, bottom, left, and right values. I’d be in favor of changing this!

[anselmh]

Using static for sticky is a bug. It should as per spec instead be relative and it caused a couple of problems in my recent testing.

[fstoerkle]

Hi @zachleat, do you have something planned here?

Would you accept a PR here?