Navigationsleiste an oberen Bildschirm Rand heften.

[Chuaat]

Hallo ich würde gerne auf meiner Website die Navigationsleiste an den oberen Rand des Bildschirms heften, der Rest soll aber Scrollbar sein. Das ganze habe ich auf einer anderen Website schon entdeckt, wusste aber nicht wie man das machen kann. Ich hoffe ich konnte mein Anliegen verständlich beschreiben.

[einsiedler]

Google einfach mal unter "sticky header", dann wirste schon etwas dazu finden!

Gruß der misabthrop

[Linuchs]

"sticky header" kann die Kopfzeile einer Tabelle sein, die beim Hochscrollen am oberen Rand kleben bleibt, solange noch Tabellenzeilen unter ihr sind.

Dein CSS-Freund ist position:fixed

[Gunnar Bittersmann]

@@Linuchs

"sticky header" kann die Kopfzeile einer Tabelle sein, die beim Hochscrollen am oberen Rand kleben bleibt, solange noch Tabellenzeilen unter ihr sind.

Da wäre position: sticky richtig, nicht fixed. ☞ Codepen

Dein CSS-Freund ist position:fixed

Nein, ist es nicht. Auch hier wäre position: sticky dein Freund. ☞ Posting

Bei position: fixed braucht man zwingend noch JavaScript, um die Headerhöhe zu bestimmen und den Hauptinhalt entsprechend zu positionieren, damit er nicht vom Header überdeckt wird.

LLAP 🖖

[Gunnar Bittersmann]

@@einsiedler

Google einfach mal unter "sticky header", dann wirste schon etwas dazu finden!

Und zwar vermutlich haufenweise Unsinn.

LLAP 🖖

[einsiedler]

Hi Gunnar, schon, hast Recht, aber was geht es mich an, ich verwende so etwas ja nicht. Wie ja dort: https://forum.selfhtml.org/self/2015/dec/17/sticky-header-meinung/1657181 mal festgestellt wurde ist ein feststehender Header nur selten von nutze, zum Teil auch (z.B. bei einer Schriftvergrößerung, problematisch. Oder hab ich das falsch verstanden?

Gruß der misanthrop