-
Fixed Header
Hallo,
ich habe ein kleines Problem mit CSS, nämlich dass die Kopfzeile gefixt ist, obwohl sie es nicht sollte. Generiert wird die Kopfzeile mit
Code:
<div class="header-navigation"
, wobei die header-navigstion eigentlich doch nur bei
Code:
<div class="header-navigation is-fixed"
gefixt sein sollte, soweit jedenfalls mein Verständnis.
Hier sind die beiden CSS Einträge:
Code:
.header-navigation { position: relative; } .header-navigation.is-fixed { position: fixed; top: 0; left: 0; width: 100%; box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); -webkit-transform: translateZ(0); -moz-transform: translateZ(0); -ms-transform: translateZ(0); -o-transform: translateZ(0); transform: translateZ(0); z-index: 1000; }
Um diese Seite geht es: www.tsg-wieseck.de (Oneo Theme).
Leider darf die Kopfzeile in der mobilen Ansicht nicht gefixt sein, da dann das Menü nicht mitscrollt und man so nicht alle Einträge sieht. Alternativ würde ich auch eine Lösung mit gefixtem Header und scrollendem Menü in der mobilen Ansicht nehmen.
Gruß
-
Ich habe jetzt nur mal ganz kurz drauf geschaut und bin der Meinung, dass es nichts mit dem von Dir oben angegebenen Code zu tun hat.
Der Vergleich mit der Oneo-Demo zeigt, das es dort funktioniert. Das heisst, dass Du Dir mit Deinen eigenen Veränderungen etwas "zerhauen" hast.
Gefunden habe ich bei Dir
Code:
.main-navigation-mobile.is-enabled {position: fixed;
...
}
Damit bleibt die Navigation immer an der gleichen Position. Mit
Code:
.main-navigation-mobile.is-enabled {position: absolute;
...
}
so wie im Original kann die Navigation gescrollt werden.
Ich weiss natürlich nicht warum Du das geändert hast.
-
Danke für die Antwort!
Warum das so geändert war, das weiß ich nicht, das war mein Vorgänger. Ich hatte mich schon kurz gefreut, dass es daran liegen könnte, aber nein. Auch nachdem ich den Wert auf absolute gesetzt habe, bleibt die Leiste am PC und am Handy oben gefixt.
Gruß
-
Die Leiste ist noch immer gefixt, aber Du kannst die Navigation scrollen.
