Statische Menüleiste 'wächst' bei Skalierung über den Content

[Oldpete]

Hi.

Ich habe eine fixierte Menüleiste an der Oberkante meiner Seite. Beim Runterscrollen bleibt sie folglich im Vordergrund und der Seiteninhalt verschwindet dahinter.

Mein Menü ist fließend angelegt und bei kleineren Browserbreiten wird es auf mehrere Zeilen umgebrochen.

Da sich der Seiteninhalt in seinem Abstand nach oben nicht am Menü orientiert sondern an der Seitenoberkante, verdeckt das mehrzeilige Menü dann aber Teile des Seiteninhalts.

Meine Frage lautet also: Wie kann ich den Abstand von Seiteninhalt zu Seitenoberkante abhängig davon machen wie hoch mein Menü ausfällt?

Vielen Dank

[Matthias Apsel]

Om nah hoo pez nyeetz, Oldpete!

Meine Frage lautet also: Wie kann ich den Abstand von Seiteninhalt zu Seitenoberkante abhängig davon machen wie hoch mein Menü ausfällt?

Im Prinzip ist das mit CSS nicht möglich.

Du könntest allerdings Media Queries nutzen.

Bei welcher Viewportbreite ist das Menü _sehr wahrscheinlich_ zweizeilig? Für diesen Fall ändere den oberen Abstand des Seiteninhalts.

Matthias

[Gunnar Bittersmann]

@@Matthias Apsel:

nuqneH

Im Prinzip ist das mit CSS nicht möglich.

Doch, das ist es. In Firefox und Safari heute schon.

Für andere Browser müsste man einen Polyfill einsetzen.

Bei welcher Viewportbreite ist das Menü _sehr wahrscheinlich_ zweizeilig? Für diesen Fall ändere den oberen Abstand des Seiteninhalts.

Und bei Änderungen am Inhalt des Menüs muss man das Stylesheet anpassen? Was mit ziemlicher Wahrscheinlichkeit dann vergessen wird?

Nein, das ist ein mieser Hack, keine Lösung.

Qapla'