Html引導多級菜單項與其他項目混合

-2

我想獲得一些幫助，我正在創建一個網站，但遺憾的是我並不擅長這一點。網站的這一部分包含2列和多級菜單/列表在第一列。當你點擊該菜單的項目時，它不覆蓋第二列內的文本。我想讓你告訴我如何讓我的菜單放置在這些菜單之上，這樣它就不會混合變成這樣。這是它的樣子。 Html引導多級菜單項與其他項目混合

這是我的CSS。

.dropdown-submenu { 
    position: relative; 
} 


.dropdown-submenu>.dropdown-menu { 
    top: 0; 
    left: 100%; 
    margin-top: -6px; 
    margin-left: -1px; 
    -webkit-border-radius: 0 6px 6px 6px; 
    -moz-border-radius: 0 6px 6px; 
    border-radius: 0 6px 6px 6px; 
} 

.dropdown-submenu:hover>.dropdown-menu { 
    display: block; 
} 

.dropdown-submenu>a:after { 
    display: block; 
    content: " "; 
    float: right; 
    width: 0; 
    height: 0; 
    border-color: transparent; 
    border-style: solid; 
    border-width: 5px 0 5px 5px; 
    border-left-color: #ccc; 
    margin-top: 5px; 
    margin-right: -10px; 
} 

.dropdown-submenu:hover>a:after { 
    border-left-color: #fff; 
} 

.dropdown-submenu.pull-left { 
    float: none; 
} 

.dropdown-submenu.pull-left>.dropdown-menu { 
    left: -100%; 
    margin-left: 10px; 
    -webkit-border-radius: 6px 0 6px 6px; 
    -moz-border-radius: 6px 0 6px 6px; 
    border-radius: 6px 0 6px 6px; 
}

來源

2016-07-30 Kalisperinos

可能是創建JSFiddle或CodePen和/或發佈相關HTML代碼的好主意。沒有這個，很難看到可能發生的事情。 – Toby

我的猜測是，你需要添加一個更高的z-index到你的子菜單。 $圖標似乎具有較高的z-index，使其位於子菜單之上。

嘗試添加類似

.dropdown-submenu { 
    position: relative; 
    z-index: 1000; /* A high number */ 
}

如果不行，我們需要看到的jsfiddle或適當的例子來實際的代碼

詩的鏈接：我會回覆在希臘，但這是一個國際網站。如果您需要幫助，請發送郵件給我，我們可以在希臘語中進行討論...

來源

2016-07-30 15:07:08 Dogoku

Html引導多級菜單項與其他項目混合

回答

相關問題