無法獲得z-index在這些CSS背景元素上工作

Question

我正在嘗試改進我的css，特別是使用z-index來重疊元素並更改堆棧順序。我創建了這個小提琴，但是當我更改z-index的值時，圖層保持不變。我無法讓z-index做任何事情。

http://jsfiddle.net/mjmitche/AfPWE/24/

，不使用的z-index，另一個div中一個div總是出現在頂部。我試圖把它放在使用z-index的容器div下，但沒有運氣。所以後來我認爲可能是彼此內部的div不能改變堆棧順序，所以我在這些之外創建了另一個div但不能改變它的堆棧順序

Answer 1

這不起作用z-index元素是從其父項繼承的。爲了得到這個工作，你必須「去的孩子」的元素：

<div id="green"></div> 

<div id="black"></div> 

<div id="pink"></div> 

而且還z-index需要有一個位置還可以，但你有。

Answer 2

重疊的分部需要處於彼此相同的水平。檢查這個小提琴： http://jsfiddle.net/jmqwZ/

我創建了一個「其他」div在粉紅色的相同水平。您可以嘗試交換他們的z索引。