我正在尝试将标头置于 DOM 中的所有内容之上。这不是爱它：
图 1 （左容器阴影打开）
图 2 （左容器阴影关闭，标题阴影打开）
“快速选择”上方的阴影应位于标题下方。换句话说，它不应该在那里！！我几乎尝试了一切。我还没有尝试为每个部分和 div 设置索引。我的页脚实际上高于一切，但我猜是因为它位于 DOM 的末尾。我也尝试将我的标题移到那里，但它没有用。我什至尝试将其更改为 DIV 并移动它。没什么...这是货物：
更新 2012.20.07 上午 12:56
好的，所以这真的很奇怪。事实证明，标题确实位于图像上的菜单上方。如果我关闭“快速选择”容器上的阴影并向标题添加阴影，则表明标题在前面。参见图 2。我不确定它是否相关，但“快速选择”菜单的部分包含一个 JQuery 手风琴。
HTML
<header id="mainHeader">
<h3>Angiograph: Head & 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);
}