Collapse Menü bootstrap Positionierung schlecht

Ich versuche, mein Menü reagieren mit Bootstrap.Collapse Menü bootstrap Positionierung schlecht

Hier ist mein aktuelles Menü Ich versuche es zusammenbrechen zu lassen und momentan verschwindet es einfach und zeigt nicht das Symbol (3 Zeilen in einer Box). Irgendwelche Vorschläge, was ich falsch mache? Okay, ich habe herausgefunden, dass das CSS es nicht erlaubt zu erscheinen, da die Farben falsch waren. Ich habe es weiß gemacht und jetzt erscheint es. Aber es ist ein kleiner Buggy, es lässt das Menü neben dem unteren erscheinen und dann schnell nach unten. Wie kann ich das beheben?

<div class="navbar-header"> 

<a class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> 
    <span class="icon-bar"></span> 
    <span class="icon-bar"></span> 
    <span class="icon-bar"></span> 
    </a></div 
<div class="width-navigation table-cell table-right navbar-collapse collapse"> 
        <ul class="nav navbar-nav menu-main-menu"> 
         <li class="menu item"><a href="#">home</a></li> 
         <li class="menu item"><a href="#">test1</a></li> 
         <li class="menu item"><a href="#">test2</a></li> 
         <li class="menu item"><a href="#">test3</a></li>   
        </ul>   
</div> 


@media (max-width: 991px) { 
    .navbar-header { 
     float: none; 
    } 
    .navbar-left,.navbar-right { 
     float: none !important; 
    } 
    .navbar-toggle { 
     display: block; 
    } 
    .navbar-collapse { 
     border-top: 1px solid transparent; 
     box-shadow: inset 0 1px 0 rgba(255,255,255,0.1); 
    } 
    .navbar-fixed-top { 
     top: 0; 
     border-width: 0 0 1px; 
    } 
    .navbar-collapse.collapse { 
     display: none!important; 
    } 
    .navbar-nav { 
     float: none!important; 
     margin-top: 7.5px; 
    } 
    .navbar-nav>li { 
     float: none; 
    } 
    .navbar-nav>li>a { 
     padding-top: 10px; 
     padding-bottom: 10px; 
    } 
    .collapse.in{ 
     display:block !important; 
    } 
} 
.navbar-toggle .icon-bar { 
    background-color: white; 
    border-color: white;

}

Quelle

2016-07-04 Josip Gòdly Zirdum

Überprüfen Sie die Dokumentation für die Standardstruktur [navbar] (https://getbootstrap.com/components/#navbar-default). – vanburen

Ich habe es mir angeschaut und ich denke, meine passt recht gut zusammen. Das einzige Problem, das ich jetzt habe, ist, dass es eine Verzögerung gibt, wenn das Menü geöffnet wird, wenn es zusammengebrochen ist, es erscheint hoch und geht dann runter. Irgendwelche Ideen? Wenn ich im Bootply teste, ist es in Ordnung. :/ –

Es wurde gefixt, etwas CSS gefunden, das nervte. –

Ich denke, Ihr navbar Struktur falsch ist.

Überprüfen Sie die Dokumentation in: http://getbootstrap.com/components/#navbar

Sind Sie jQuery korrekt aufrufen?

Vergessen Sie nicht: 1.: Rufen Sie jquery.min.js 2. Start: bootstrap.min.js

Rufen Sie die Skripte NACH Ihrem Code.

PS: Ich mag diese Dateien vor dem Tag aufrufen.

Quelle

2016-07-04 13:41:54

Collapse Menü bootstrap Positionierung schlecht

Antwort

Verwandte Themen