“z-index”在Bootstrap导航栏和下拉列表中

Question

我的导航栏下拉列表和购物车下拉列表中存在问题。

我不知道如何解决这个问题（我对css z-index没有深入的了解）。

我想要的是购物车菜单下拉菜单下拉菜单，并保留在navbar之上。

我在两个下拉菜单上都更改了z-index，但无法正常工作。
谢谢。

以下是图像：

这里是工作的jsfiddle：
https://jsfiddle.net/nmdh5vmv/2/

Answer 1

需要ASIGN购物车菜单下拉比导航栏菜单下拉的z-index一个z-index更大

.mega-dropdown-menu{ 
    z-index: 1; 
} 

.shopping-whist-bag{ 
    z-index: 2; 
}