Position:fixed within position:fixed: which browser is correct?

Question

Positioning a fixed element inside another fixed element is behaving differently in Chrome / Safari vs Firefox.

This answer explains well the expected behavior for a fixe

Answer 1

So, I think problem has arisen due to the bug in implementation of left in Firefox.

When hovering .wrapper, .header should get new left value from its parent .wrapper i.e. 0px. When hovering .wrapper, the left position of .header should be calculated using the left value from its parent .wrapper as no explicit left value is given to .header.

I think its due to bug in Firefox. If you activate :hover pseudo class of .wrapper using Firebug or the default developer tool, the left position of .header is maintained like in Chrome (but in sudden manner).

Tested on Firefox 49.0.2 and Chrome 54.0.2840.71