I've discovered a difference in flexbox implementation between Chrome and Firefox/Safari. When you have a position absolute element that has no top/bottom/left/right set, in Chrome the element snaps to top: 0, left: 0, while in the other browsers the top and left values are the same as if the element was statically positioned.
Take a look at the codepen here.
What is the recommendation of the flexbox spec for this situation? Which browser or browsers are demonstrating buggy behavior?
Yes, this is a difference in layout between Blink and WebKit.
I think the current recommendation would be to either specify the
left, or use something that has better behavior.
I think Blink (Chrome) is technically correct here.
Absolutely positioned children should not participate in the flex box layout model.
They should be treated as the starting item in the element.
Edit: They may need to update their test cases - they need to separate Blink and WebKit, and they need this particular overlap test.