xt 6.1.2 Navigationsleiste (Navbar) /Header fixieren

[gwb]

Hallo,

hat jemand Erfahrungen mit der Navigationsleiste? Wie kann ich diese und ggf. den Header(Logo und Suche) fixieren, sodass die Navbar beim Scrollen immer sichtbar bleibt?

[ador-design.de]

Das kannst du mit CSS und jQuery machen. Stichwort: position:fixed (css). Ganz so einfach mit einer Zeile ist das nun aber nicht getan.

Du kannst ja mal hier schauen: https://www.w3schools.com/howto/howto_css_fixed_menu.asp

[schindler-tk]

Hallo,

ich hab mich ebenfalls mal daran probiert. Mein Problem ist die Positionierung des Headers. Mit "position:....." funzt das nicht.
Hier meine zeilen in der css - der Content schiebt sich immer in den Vordergrund. Das Menü bleibt wie gewünscht stehen. Verschwindet dann aber hinter dem Content.

 

Vielleicht weiß einer einen Rat?

position: fixed;

top: 0;

width: 100%;

 

[jhahn]

puh.... ador hat recht: mit einer zeile isses wahrscheinlich nicht getan.

nur als ansatz, zum rumspielen:

#header {
    position: fixed;
    z-index: 100000;
    background-color: white;
    width: 100%;
}

ja und dann brauch der eigentliche scroll-content ein padding-top

#conatainer {
    padding-top: 200px;
}

diese 200px hab ich jetzt willkürlich gewählt, evtl muss man das noch in ein media-query-size packen, je nach header-höhe ?
https://www.w3schools.com/css/css_rwd_mediaqueries.asp

ich hasse layout-arbeiten, vlt muss man das ganz anders machen. z-index grösser 1 ist wohl verpöhnt. javascript würde ich an dieser stelle aber echt vermeiden.
keine ahnung, aber vlt hilfts als denkrichtung.