Navbarの第2のサブメニューが正しく配置されていません

Question

この質問はここにあるスレッドに基づいています。Here第2レベルの項目が上にない限り、これはすべて正常に機能します。与えられた例では、第2レベルのメニューを持つ項目が最初の項目です。項目を1つまたは2つ下に移動すると、2番目のレベルが上に開きます。

CSSは、よさそうだ、私はまた、多分それはスレッド

.sidebar-nav { 
    padding: 9px 0; 
} 

.dropdown-menu .sub-menu { 
    left: 100%; 
    position: absolute; 
    top: 0; 
    visibility: hidden; 
    margin-top: -1px; 
} 

.dropdown-menu li:hover .sub-menu { 
    visibility: visible; 
} 

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

.nav-tabs .dropdown-menu, .nav-pills .dropdown-menu, .navbar .dropdown-menu { 
    margin-top: 0; 
} 

.navbar .sub-menu:before { 
    border-bottom: 7px solid transparent; 
    border-left: none; 
    border-right: 7px solid rgba(0, 0, 0, 0.2); 
    border-top: 7px solid transparent; 
    left: -7px; 
    top: 10px; 
} 
.navbar .sub-menu:after { 
    border-top: 6px solid transparent; 
    border-left: none; 
    border-right: 6px solid #fff; 
    border-bottom: 6px solid transparent; 
    left: 10px; 
    top: 11px; 
    left: -6px; 
} 

（Fiddle）で1つのデモリンクにブートストラップバージョンとしなければならなかったと思いました。

この問題を解決するために、私はFiddleからサンドボックス内を移動して同じ問題を抱えていたので、自分のコードやBootstrapバージョンではないようです。私はこのようにしているわけではありません。私は第2レベルのメニューを持ち、フルサイズのスクリーン上でホバーを開くことができる限り、何かを違うものに使うことができます。

おかげで、

デイブ

を更新し

Answer 1

私はちょうど

.dropdown-menu .sub-menu{ 
    top: auto !important; 
    margin-top:-30px !important; 
} 

を追加し、正常に動作するようです、これはあなたが望むものであるかどうかを確認してください。ここで

がfiddle