CSS Z-Index菜單下拉錯誤

Question

我已經嘗試解決了2天，但沒有成功，這讓我發瘋。

圖片鏈接

基本上，當我單擊輸入時，菜單下拉菜單與其下方的下拉菜單重疊。 我正在使用Wordpress ClickBoutique主題。

鏈接： 點擊這里

我嘗試給它們提供不同的z-index值，甚至用！important覆蓋內聯規則，但它似乎不起作用。 看來js（也許是jQuery）功能會根據用戶單擊的下拉菜單更改這些z-index值。

有人可以幫幫我嗎？

Answer 1

您的z-index聲明有沖突，您需要刪除以下注釋的內容（styles.css中的第236和243行）

.site-content .jq-selectbox,
.widget .jq-selectbox {
    font: 16px 'Roboto Condensed';
    min-width: 180px;
    width: 100%;
    /* z-index: 98 !important; REMOVE */
}
.site-content .jq-selectbox,
.widget .jq-selectbox:first-child {
    font: 16px 'Roboto Condensed';
    min-width: 180px;
    width: 100%;
    /* z-index: 99 !important; REMOVE  */
}

在下方添加內容，以便“頂部”下拉菜單與“底部”重疊。

#pa_color-styler{
   z-index:9999;
}

Answer 2

刪除其中的z-index：98到style.css第243行中的類：

.site-content .jq-selectbox，.widget .jq-selectbox：第一個孩子.site-content .jq-selectbox，.widget .jq-selectbox

Answer 3

1） .site-content .jq-selectbox, .widget .jq-selectbox:first-child

2） .site-content .jq-selectbox, .widget .jq-selectbox

您只需要從上述類中刪除z-index屬性。 它與您其他類別中的z-index屬性沖突。