resumemaker.eu
← TechnologyThe essentials of

scroll-margin-top for title under a fixed menu

Publisher: ResumeMaker • 1 source

Published: 22 Oct 2026 13:13 · Updated: 22 Oct 2026 13:13

AI source check: 21 Oct 2026 13:48. This is not editorial approval.

In a few sentences

In brief

Distance is set on the purpose of scrolling.

Useful to know

scroll-margin-top extends the upper area that is read around the target element when positioning by scrolling. Thus, a title with an internal link can remain under a fixed top bar. [1]

Example: h2[id] { scroll-margin-top: 6rem; }. The value does not add a usual gap between the title and the preceding paragraph. It is used for the behavior of scrolling. Compare it to the real height of the menu on a narrow screen when it can be positioned in two rows. Check and directly load address with a fragment.

Sources

For further detail and to check the information:

  1. [1] MDN — scroll-margin-top ↗