Sprungadresse positionieren

Habe bei meinem Projekt auf jeder meiner Seiten oben eine durchgehende Menüleiste. Unter dieser Menüleiste scrollt der Seiteninhalt hindurch oder anderst ausgedrückt das Menü schwebt über dem Text. Die Menüleiste ist in CSS geschrieben.

Hier jetzt die Frage: Wie kann ich es im HTML-Teil erreichen das beim Anspringen einer Sprungadresse(Anker) der angesprungene Text nicht unter der schwebenden Menüleiste verschwindet, sondern z.B. 150 Pixel vom oberen Bildschirmrand angezeigt wird?

Viele Wege führen nach Rom …

Wenn du die Höhe deines Menüs kennst, kannst du das Menü mit „display: fixed“ an die obere Kante „kleben“ und musst dann für den Inhalt ein „margin-top: ***em;“ setzen.

Flexibler ist allerdings die mit CSS3 neu eingeführte Flex Box. In Verbindung mit einigen weiteren CSS-Bedingungen kannst du zwei Bereiche definieren, die insgesamt das ganze Fenster ausfüllen, wobei der zweite Bereich separat gescrollt wird, wenn man einen lokalen Anker darin ansteuert. Hier habe ich dir einmal ein Beispiel angefertigt:

http://jsfiddle.net/umh29L58/2/

Aber Achtung: Das funktioniert nur mit neueren Browsern! Wenn du ältere Browser (älter als ein Jahr) unterstützen willst, dann funktioniert für dich nur die erste von mir vorgeschlagene Methode.