Responsive drawer example: AppBar hides content

[Hocdoc]

In the documentation for the Responsive drawer the content hides behind the AppBar.

• The issue is present in the latest release.
• I have searched the issues of this repository and believe that this is not a duplicate.

Current Behavior 😯

When there is enough content to scroll the page, the top content hides behind the app bar.
The <div className={classes.toolbar} /> in the source doesn't have an effect.

Expected Behavior 🤔

The content should stay below the AppBar.

I've tried the three suggestions from AppBar/Fixed placement(see also #16844) and many other things, but this doesn't work with the Responsive drawer example from the documentation.

Steps to Reproduce 🕹

I have copied the source of the MaterialUI to a new sandbox with just more content and an anchor link to a header.

When you click there on the "Inbox" item in the drawer, I expect to jump to the anchor link "A Header".
Instead the text "A Header" is hidden by the AppBar and you have to manually scroll up to see the header.

[oliviertassinari]

@Hocdoc This is a standard problem with sticky headers and anchor links: https://stackoverflow.com/questions/4086107/fixed-page-header-overlaps-in-page-anchors.

[Hocdoc]

Thank you very much, this is the solution. :-)

I was not aware of this problem, maybe it would be helpful for others if you could add this helpful link somewhere in the Material UI documentation.