`amp-iframe` overflow elements layered behind iframe content

When an overflowing resizable <amp-iframe> element is loaded in the viewport, and therefore not resized automatically, I would expect the overflow element to be positioned in front of the iframed content so that site visitors are able to easily tap it. Instead, the overflow element is currently positioned behind the iframe content.

You can reproduce this using the Disqus for Accelerated Mobile Pages (AMP) example, modified slightly since their example doesn’t include the required overflow element.

Here’s a test page to demonstrate the issue when viewed in a narrowish viewport, e.g. 480px wide, on Chrome, Safari or Firefox for Mac (others may be affected too):

https://amphtml-test.appspot.com/amp-iframe/resizable.html

Screenshot:

Please can you confirm whether this is a bug or if there’s something else causing this which can easily be prevented? Thanks!

[dvoytenko]

Actually, now that I thinking this through - this is an expected behavior. z-index requires non-static positioning. So, this is definitely a bug.

[tonyruscoe]

Thanks for tracking down the cause and fixing the issue, @dvoytenko!