Beispiel zur Notiz „Sticky-Header einrichten“

Sprungziele mit scroll-padding-top

Einen Link im Kopf klicken: Wie mit scroll-margin-top, nur einmal am Scroll-Container gesetzt.

Getestet in Chrome 152. Browserstand und Einordnung: siehe Notiz.

Abschnitt 1

Fülltext 1: Dieser Absatz ist nur da, damit die Seite lang genug zum Scrollen ist. Er hat mit dem Beispiel selbst nichts zu tun.

Fülltext 2: Dieser Absatz ist nur da, damit die Seite lang genug zum Scrollen ist. Er hat mit dem Beispiel selbst nichts zu tun.

Fülltext 3: Dieser Absatz ist nur da, damit die Seite lang genug zum Scrollen ist. Er hat mit dem Beispiel selbst nichts zu tun.

Fülltext 4: Dieser Absatz ist nur da, damit die Seite lang genug zum Scrollen ist. Er hat mit dem Beispiel selbst nichts zu tun.

Fülltext 5: Dieser Absatz ist nur da, damit die Seite lang genug zum Scrollen ist. Er hat mit dem Beispiel selbst nichts zu tun.

Fülltext 6: Dieser Absatz ist nur da, damit die Seite lang genug zum Scrollen ist. Er hat mit dem Beispiel selbst nichts zu tun.

Fülltext 7: Dieser Absatz ist nur da, damit die Seite lang genug zum Scrollen ist. Er hat mit dem Beispiel selbst nichts zu tun.

Fülltext 8: Dieser Absatz ist nur da, damit die Seite lang genug zum Scrollen ist. Er hat mit dem Beispiel selbst nichts zu tun.

Fülltext 9: Dieser Absatz ist nur da, damit die Seite lang genug zum Scrollen ist. Er hat mit dem Beispiel selbst nichts zu tun.

Fülltext 10: Dieser Absatz ist nur da, damit die Seite lang genug zum Scrollen ist. Er hat mit dem Beispiel selbst nichts zu tun.

Fülltext 11: Dieser Absatz ist nur da, damit die Seite lang genug zum Scrollen ist. Er hat mit dem Beispiel selbst nichts zu tun.

Fülltext 12: Dieser Absatz ist nur da, damit die Seite lang genug zum Scrollen ist. Er hat mit dem Beispiel selbst nichts zu tun.

Abschnitt 2

Fülltext 1: Dieser Absatz ist nur da, damit die Seite lang genug zum Scrollen ist. Er hat mit dem Beispiel selbst nichts zu tun.

Fülltext 2: Dieser Absatz ist nur da, damit die Seite lang genug zum Scrollen ist. Er hat mit dem Beispiel selbst nichts zu tun.

Fülltext 3: Dieser Absatz ist nur da, damit die Seite lang genug zum Scrollen ist. Er hat mit dem Beispiel selbst nichts zu tun.

Fülltext 4: Dieser Absatz ist nur da, damit die Seite lang genug zum Scrollen ist. Er hat mit dem Beispiel selbst nichts zu tun.

Fülltext 5: Dieser Absatz ist nur da, damit die Seite lang genug zum Scrollen ist. Er hat mit dem Beispiel selbst nichts zu tun.

Fülltext 6: Dieser Absatz ist nur da, damit die Seite lang genug zum Scrollen ist. Er hat mit dem Beispiel selbst nichts zu tun.

Fülltext 7: Dieser Absatz ist nur da, damit die Seite lang genug zum Scrollen ist. Er hat mit dem Beispiel selbst nichts zu tun.

Fülltext 8: Dieser Absatz ist nur da, damit die Seite lang genug zum Scrollen ist. Er hat mit dem Beispiel selbst nichts zu tun.

Fülltext 9: Dieser Absatz ist nur da, damit die Seite lang genug zum Scrollen ist. Er hat mit dem Beispiel selbst nichts zu tun.

Fülltext 10: Dieser Absatz ist nur da, damit die Seite lang genug zum Scrollen ist. Er hat mit dem Beispiel selbst nichts zu tun.

Fülltext 11: Dieser Absatz ist nur da, damit die Seite lang genug zum Scrollen ist. Er hat mit dem Beispiel selbst nichts zu tun.

Fülltext 12: Dieser Absatz ist nur da, damit die Seite lang genug zum Scrollen ist. Er hat mit dem Beispiel selbst nichts zu tun.

Abschnitt 3

Fülltext 1: Dieser Absatz ist nur da, damit die Seite lang genug zum Scrollen ist. Er hat mit dem Beispiel selbst nichts zu tun.

Fülltext 2: Dieser Absatz ist nur da, damit die Seite lang genug zum Scrollen ist. Er hat mit dem Beispiel selbst nichts zu tun.

Fülltext 3: Dieser Absatz ist nur da, damit die Seite lang genug zum Scrollen ist. Er hat mit dem Beispiel selbst nichts zu tun.

Fülltext 4: Dieser Absatz ist nur da, damit die Seite lang genug zum Scrollen ist. Er hat mit dem Beispiel selbst nichts zu tun.

Fülltext 5: Dieser Absatz ist nur da, damit die Seite lang genug zum Scrollen ist. Er hat mit dem Beispiel selbst nichts zu tun.

Fülltext 6: Dieser Absatz ist nur da, damit die Seite lang genug zum Scrollen ist. Er hat mit dem Beispiel selbst nichts zu tun.

Fülltext 7: Dieser Absatz ist nur da, damit die Seite lang genug zum Scrollen ist. Er hat mit dem Beispiel selbst nichts zu tun.

Fülltext 8: Dieser Absatz ist nur da, damit die Seite lang genug zum Scrollen ist. Er hat mit dem Beispiel selbst nichts zu tun.

Fülltext 9: Dieser Absatz ist nur da, damit die Seite lang genug zum Scrollen ist. Er hat mit dem Beispiel selbst nichts zu tun.

Fülltext 10: Dieser Absatz ist nur da, damit die Seite lang genug zum Scrollen ist. Er hat mit dem Beispiel selbst nichts zu tun.

Fülltext 11: Dieser Absatz ist nur da, damit die Seite lang genug zum Scrollen ist. Er hat mit dem Beispiel selbst nichts zu tun.

Fülltext 12: Dieser Absatz ist nur da, damit die Seite lang genug zum Scrollen ist. Er hat mit dem Beispiel selbst nichts zu tun.