Header sowohl auf Browserbreite dehnen, als auch oben fixieren?

Julesy schrieb am 01.03.2017 um 10:58 Uhr

Hallo ihr Lieben,

ich hab hier schon einige nützlichen Tipps gefunden, und hoffe dass ihr mir nun auch mit meinem Problem helfen könnt..

Ich möchte in meiner Website oben einen bunten Balken haben, auf dem das Navigationsmenü steht. Der Balken soll immer das ganze Browserfenster füllen, und zusammen mit der Navigation immer am oberen Fensterrand stehen bleiben wenn auf der Seite gescrollt wird. Dank HTML habe ich es endlich geschlafft, die Navigationsleiste so hin zu kriegen, dass die oben stehen bleibt.. bei dem Balken hab ich aber das Problem, dass dieser entweder die ganze Fensterbreite einnimmt, dafür aber mit scrollt, oder oben stehen bleibt, dann aber nur so breit ist wie die eigentliche Seite....

ich hab eigentlich überhaupt keinen Plan von HTML, und in den Web Designer (10 Premium) arbeite ich mich auch gerade erst ein.. Ich hoffe hier hat jemand einen Tipp für mich wie ich das hinkriegen kann :)

Kommentare

BeRo schrieb am 01.03.2017 um 21:47 Uhr

[...] ich hab eigentlich überhaupt keinen Plan von HTML [...]

Den wirst Du auch nicht brauchen 😉

Nach 2 Schritten ist Dein Problem gelöst.

  1. Navigationsleiste fixieren
  2. Rechteck in Balkenform erstellen, unter die NavBar legen und fixieren + ausdehnen

Das war's
 

Auf den Tag genau gehen heute, am 14.08.2021, 10 Jahre online Support für die Community zu Ende.
Ich freue mich auf eine neue, berufliche Herausforderung, die sich gerade ergeben hat. Leider bleibt dann keine Zeit mehr für die Community übrig, aber Ihr seid bei den aktiven Mitgliedern in besten Händen.
Sicher schaue ich auch ab und zu nochmal rein... 🤓

Julesy schrieb am 03.03.2017 um 11:50 Uhr

Hallöchen, das hab ich hier schon öfters gelesen... nur gibts diese Funktion bei 10er anscheinend einfach noch nicht... oder sie ist wo anders versteckt..?

BeRo schrieb am 03.03.2017 um 13:05 Uhr

[...] nur gibts diese Funktion bei 10er anscheinend einfach noch nicht [...]

Richtig, leider 😖

Die "fixieren" Funktion wurde erst mit der Version 11 eingeführt.
Vielleicht denkst Du mal über ein Upgrade nach... 😉

Alternativ kannst Du auch über ein zusätzliches JavaScript die Funktion nachbauen. Im Forum haben wir schon oft Lösungen dazu angeboten, z. B. hier oder hier oder...

Die Beispiele, die Du auf den verlinkten Seiten findest, müssen ggf. angepasst werden. Prinzipiell zeigen sie aber den Lösungsweg für Dein Problem.

Auf den Tag genau gehen heute, am 14.08.2021, 10 Jahre online Support für die Community zu Ende.
Ich freue mich auf eine neue, berufliche Herausforderung, die sich gerade ergeben hat. Leider bleibt dann keine Zeit mehr für die Community übrig, aber Ihr seid bei den aktiven Mitgliedern in besten Händen.
Sicher schaue ich auch ab und zu nochmal rein... 🤓