html - z-index が正しく機能しない

Question

何らかの理由で、z-index が機能しません。

¬ .levelThree pos:ab
      ¬ .internalMenu > ul > li pos:rel
           ¬ .levelFive pos:ab

.levelFive は、他のすべての要素の前にある必要があります。

JSフィドル・ヒア

Answer 1

li.activeにz-indexを指定します。このように書いてください：

.internalMenu > ul > li, .levelThree > ul > li.active{
    z-index:10;
}

これをチェックしてくださいhttp://jsfiddle.net/dCYdw/10/

Answer 2

レベル 5 を他のすべての要素の前に表示したい場合は、z-indices を設定する必要さえありません。自然な積み上げ順序では親の上に子が存在するからです。

ただし、記録のために、これ (短縮) が表示されますが、これは間違っています。

.levelFive { z-index: 2; }
.levelThree li { z-index: 3; }

これは、.levelThree (.levelFive の親を含む) のすべての li が、levelFive のどのものよりも高い z-index を持っていることを明確に示しています。

したがって、タイトルが正しくありません。z-index は正しく機能しますが、正しくコーディングされていません。