The fix is to shift the anchor to above the header.

Can you elaborate on what you mean by this? Because I can think of a couple of meanings of "above" there, none of which seem like they'd have the desired effect.

It confused me at first too, but now I think I know what he means. Before the header you're linking to - h3 or whatever. Link to some content enough above that header to compensate for the sticky header.

That seems like an awkward semantic break to compensation for presentation, as well as error-prone in size-matching.

Better if the browser knew about the header and could position the linked anchor accordingly. In the absence of any facility to do that, just ditch the header.

It actually is possible to do - you can use CSS to move the position of the anchor tag. If I recall there were some extra CSS properties needed to make it work, but it can be done.

yeah, or just

  * {margin:2em}

That would break the most common method of centering the main content (margin-left: auto; margin-right: auto)

Not necessarily. A more specific selector overrides a less specific one, and a later selector overrides an earlier one.