為什麼我的引導下拉清單會出現在 Internet Explorer 7 中其他元素的後面？

Bootstrap 下拉菜單出現在其他元素後面[重複]

問題：

在Bootstrap 2.3 中.1 中，使用「dropdown-menu」類別建立的下拉式選單特別出現在Internet Explorer 7 上的文字和其他元素後面，儘管分配了較高的z-index。

診斷：

問題源自於堆疊上下文問題。儘管下拉清單具有 z 索引，但它僅適用於同一堆疊上下文中的元素。在這種情況下，下拉清單的父元素需要明確的 z-index 和位置來建立新的堆疊上下文。

解決方案：

修改CSS，如下:

<code class="CSS">.header-top {
  z-index: 10000;
  position: relative;
}

.header .header-nav ul#nav-account ul.dropdown-menu,
.header .header-nav ul#nav-library ul.dropdown-menu {
  z-index: 1;
}</code>

透過在「.header-top」上設定「z-index: 10000”和“position:relative”，創建一個新的堆疊上下文。然後，為該上下文中的下拉式選單指派一個“z-index：1”，以確保它們位於該上下文中任何其他內容的前面。這將建立所需的分層並解決 Internet Explorer 7 中的問題。

以上是為什麼我的引導下拉清單會出現在 Internet Explorer 7 中其他元素的後面？的詳細內容。更多資訊請關注PHP中文網其他相關文章！