塊z定位沒有z-index的

Question

請看看：http://twitter.github.com/bootstrap/base-css.html

有許多例子像這樣的：

如果你看看更接近塊邊界

，你可以看到灰色塊在白色之下。使用瀏覽器的開發者工具，你可以看到這兩個盒子都有一個繼承的z-index: auto;

我無法在我的網站上重現此效果（不使用z-index）。
所以，我的問題是：爲什麼灰色塊下的白色？

Answer 1

這是因爲第一個元素設置了position:relative，而另一個沒有。

Here's a simplified example.

注意，當您從第一個元素刪除相對定位，它就會由2隱藏。

Answer 2

白色容器設置爲使用position:relative，它將其置於灰色框的前面。

如果灰箱也被設置爲使用position:relative，則需要在白色容器下方顯示較低的z索引。