Z指數不工作：位置設置

我想在DOM中的任何東西上面帶頭。它不喜歡它：Z指數不工作：位置設置

圖像1 （與左容器陰影）

enter image description here

圖像2 （左容器陰影和關閉頭陰影）

'Quick Pick'上方的陰影應該在標題下方。換句話說，它不應該在那裏！我已經嘗試差不多的一切。我仍然沒有試圖用索引設置每一個部分和div。我的頁腳實際上超越了一切，但我猜測是因爲它在DOM的末尾。我也嘗試將標題移到那裏，但它不起作用。我甚至嘗試將它改爲DIV並移動它。沒什麼......這裏的商品：

UPDATE 2012.20.07上午12時56

好了，所以這是非常奇怪的。事實證明，標題確實在圖像上的菜單上方。如果關閉「Quick Pick」容器上的投影並向投影頭添加陰影，則會顯示標題在前面。見圖2.我不確定它是否相關，但持有「快速選擇」菜單的部分包含JQuery Accordion。

HTML

<header id="mainHeader"> 
<h3>Angiograph: Head &amp; Neck</h3> 
<p><i>Ag-01 through Ag-14</i></p> 
</header> 
<section id="mainSection"> 
    <img id="theImage" src="images/mods/angiograph/head/Ag1.jpg" title="Ag-01" alt="Ag-01"> 
<div id="leftMenu"> 
    <div id="addHolder"> 
<!-- Quick Pick Section --> 
     <h3 class="topHeader"><a href="#">Quick Pick</a></h3> 
     <div id="quickPick"> 
      <ul id="thumbList"> 
      </ul> 
     </div> 

.......

CSS

#mainHeader{ 
position: absolute; 
left: 0; 
top: 0; 
height: 10%; 
width: 100%; 
z-index: 3; 

-webkit-box-shadow: 0px 0px 15px rgba(0, 0, 0, .75); 
-moz-box-shadow: 0px 0px 15px rgba(0, 0, 0, .75); 
box-shadow: 0px 0px 15px rgba(0, 0, 0, .75); 
} 

#mainSection{ 
position: absolute; 
left: 0; 
top: 10%; 
height: 85%; 
width: 100%; 
background-color: #464040; 
z-index: 1; 
} 

#mainSection #leftMenu { 
position: absolute; 
width: 15%; 
height: 100%; 
left:0; 
background-color: #141111; 
z-index: 2; 

-webkit-box-shadow: 0px 0px 15px rgba(0, 0, 0, .75); 
-moz-box-shadow: 0px 0px 15px rgba(0, 0, 0, .75); 
box-shadow: 0px 0px 15px rgba(0, 0, 0, .75); 
}

來源

2012-07-20 atomSmasher