css - -webkit-overflow-scrolling: touch は z-index のない要素に新しいスタック コンテキストを作成します

Question

問題

iOS 6 は、が設定されているかどうかに関係なくposition、すべての子孫に対して新しいスタック コンテキストを作成するようです。staticz-index

-webkit-overflow-scrollingこれが通常の予想される動作なのか、それともスタック順序を妨げるバグなのか、誰かが知っていますか?

例

以下のコード、またはJSFiddleを参照してください。

どちらrowの要素にも positionrelativeがありますが、ありませんz-index。私のラップトップの Google Chrome と Safari の両方が、2 番目の上に青い「サブメニュー」をレンダリングしますrow。

サンプルが iOS シミュレーターでテストされている場合、「サブメニュー」は 2 番目の の後ろにレンダリングされますrow。を削除すると、-webkit-overflow-scrolling: touch期待どおりにレンダリングされます。

追加すると、設定されているかどうかに関係なく-webkit-overflow-scrolling: touch、位置が設定されているすべての子孫に対して新しいスタッキングコンテキストが作成されるようです。staticz-index

<style>
    div.content {
        -webkit-overflow-scrolling: touch;
    }

    div.row {
        width: 100%;
        position: relative;
        background: red;
        margin-bottom: 10px;
    }

    div.sub {
        position: absolute;
        top: 100%;
        z-index: 2;
        background: blue;
    }
</style>
<div class="content">
    <div class="row">
        A
        <div class="sub">
            Sub menu of A<br>
            Sub menu of A<br>
            Sub menu of A<br>
            Sub menu of A<br>
        </div>
    </div>
    <div class="row">
        B
    </div>
</div>

```

** 追記 ** この投稿に '-webkit-overflow-scrolling' のタグを付けたいのですが、新しいタグを作成するのに十分な評判がありません。