通過較低的div

Question

問題重疊的下拉菜單可以在我的測試網站上找到：http://udkcf.geekgirlcoding.com/

我創建了一個下拉菜單（在頂部的灰色框）。當我展開菜單時，菜單項將與品牌部門或網站內容重疊。我嘗試設置/更改z-index值，但沒有運氣。

Answer 1

'z索引'
...
對於定位的盒子中， 'z索引' 屬性指定：

盒子的當前堆棧級別堆疊上下文。 框是否建立了堆疊上下文。 值具有以下含義：

• <整數>
  此整數是在當前堆疊內容所生成的框的層疊級別。該框還建立了新的堆疊環境。
• auto
  當前堆棧上下文中生成的框的堆棧級別爲0.除非該框架是根元素，否則該框不會建立新的堆棧上下文。

http://www.w3.org/TR/CSS2/visuren.html#propdef-z-index

所有周圍的元素將有一個的 z-index，這意味着它們沒有定義一個新的堆疊順序，將在它們出現的順序疊加。

因此，您可以簡單地應用z-index的以將有問題的元素排除在自然堆疊順序之外。

這將告訴瀏覽器，你想要的元素是所有其他元素上面

• 除非有具有相同z-index值
• 或有任何元素的任何下列元素，這可能在之前或之後出現，其具有較高的值z-index值。

.dl-menuwrapper { 
    z-index: 1; 
} 

Answer 2

將下面的代碼添加到樣式表中。

article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary { 
    display: block; 
    z-index: -999; 
    position: relative; 
}