condensed Menü Inhalt wandert bei viewports

  • Hallo Allerseits!


    Bei dem bereits an anderer Stelle von mir genannten template (http://www.lyzarr.com/testsite), habe ich ein Problem mit dem aufgeklappten condensed Menü.
    Dort springt beim viewport 767px die Navigation ein gutes Stück nach rechts. Zusätzlich wandern die Menüpunkte beim Zusammenschieben des Browserfensters an sich stetig nach links.
    Mit anderen Worten, da ist mächtig Bewegung drin, die möchte ich aber gerne weg haben.


    Ich habe zur einfacheren Veranschaulichung das mal in einem animierten gif festgehalten:


    und hier nochmal ganz langsam:



    Nun kann ich diesen Sprung nach rechts der Navi bei 767px mit folgendem Eintrag entgegenwirken:


    Code
    @media (max-width: 767px) {
     div.nav-collapse.in.collapse {
        left: -20px;
     }


    Aber das ist dann mehr eine Bekämpfung der Symptome als des eigentlichen Problems, nämlich daß die navi nicht einfach stehen bleibt, wie beispielsweise das Logo darüber.


    Hat Jemand eine Idee woran das liegt und wie das zu korrigieren ist?


    Besten Dank im Voraus.

    • Hilfreich

    .top-menu-row .span9 hat 98% Breite. 2% ändern sich beim Zusammenschieben.


    Recht einfach mit dem Inspektor rauszufinden (Firefox.) Anklicken und beobachten.


    Noch ein Tipp: Auf einem responsive Menü gibt es selten Hover.

  • Wahnsinn! Tausend Dank - für Deinen Beitrag!


    Ein Ändern auf 100% der Breite für .top-menu-row .span9 hat das Problem beseitigt.
    Und die nachfolgende Änderung des obigen Schnipsels hat den Sprung der Navi beim bestimmten viewport beseitigt.:


    Code
    @media (min-width: 767px) {
     div.nav-collapse.in.collapse {
        left: 20px;
     }


    Nochmals vielen Dank!