Safari 6.1 hides inner div, when outer div has position:fixed and overflow:auto

Question

Safari seems to have changed their rendering of child objects outside their parents, in certain situations.

Setup:

• A parent (#outer) div with position:fixed and overflow:auto
• A child (#inner) div with position:fixed and positioned above or below parent

Example: http://jsfiddle.net/2tp9R/

I have only been able to reproduce this in safari 6.1. Firefox, Chrome and IE renders the child as safari used to do.

Question: How can this be worked around?

P.S. Jeopardy!-ish question.

Answer 1

Workaround

If overflow:auto is removed or fixed is changed to absolute the child is showed.

Example: http://jsfiddle.net/5kfbe/

This may not solve the problem in all situations though, e.g. when you need overflow:auto and position:fixed to be set on your parent div. Anyone got a better solution?