降低z-index的原因子孫元素成爲不可點擊

Question

我有一個（CSS）疊加的問題。下面

在我開發網站的標籤盒具有的z-index設置爲-1，這樣他們的邊界出現在他們的選項卡背後，使得有源標籤的白色底部邊框覆蓋它。但是在所有的瀏覽器上，除了Opera，這使得tab-boxes（鏈接，表單等）的後代變得不可點擊。你可以看到這個在：

http://od.philosofiles.com/

誰能幫助？這裏的HTML和CSS的梗概，雖然上面的檢查與螢火蟲很可能會更照亮鏈接：

<ul class="odtabs"> 
    <li id="tab-Authors1" class="first active"><a href="link">Tab</a></li> 
</ul> 
<div id="tab_content-Authors1" class="odtab-content"> 
    <p><a href="link">Tab Box</a></p> 
</div> 

<style type="text/css"> 
    <!-- 
    .odtabs li { 
    float: left; 
    background-color: #ddd; 
    width: 80px; 
    height: 19px; 
    list-style-type: none; 
    } 

    .odtabs li.active { 
    background-color: white; 
    border-bottom-color: white; 
    } 

    .odtab-content { 
     border: 1px solid #babcbd; 
     margin-top: -1px; 
     clear: both; 
     position: relative; 
     top: -1px; 
     z-index: -1; 
    } 
    --> 
</style> 

Answer 1

我終於這個固定自己，之後實驗的很多與行由行重建。我認爲這個問題是由於Z指數爲負值;然而，使其以積極的z-index和較高的正的z-index工作的唯一辦法就是設置位置：在選項卡上，這需要一個完全不同的方法相對。 （很明顯的z-index只適用於絕對，相對或固定定位的元素。）在這裏，對於那些有興趣/有類似的問題，是完整的CSS我用：

ul.odtabs { 
    display: inline; 
    margin: 0; 
    padding: 0; 
} 

.odtabs li { 
    float: left; 
    background-color: #ddd; 
    border: 1px solid #babcbd; 
    width: 80px; 
    height: 19px; 
    margin-right: 2px; 
    text-align: center; 
    list-style-type: none; 
    position: relative; 
    z-index: 2; 
} 

.odtabs li.active { 
    background-color: white; 
    border-bottom-color: white; 
} 

.odtabs a { 
    color: #78797c; 
    font-size: 0.75em; /* 9px = 12*0.75 */ 
    font-weight: bold; 
    margin-top: 0px; 
    padding-top: 0px; 
} 

.odtabs .last { 
    margin-right: 0px; 
} 

.odtab-content { 
    font-size: 0.9166em; 
    border: 1px solid #babcbd; 
    padding: 0px 1em; /* ie. 12px */ 
    clear: both; 
    position: relative; 
    top: -1px; 
    z-index: 1; 
} 

Answer 2

組Z指數爲-100。

.odtab-content { 
border:1px solid #BABCBD; 
clear:both; 
font-size:0.9166em; 
margin-top:-1px; 
padding:0 1em; 
position:relative; 
top:-1px; 
z-index:-100; 
}