Contribution guidelines

• I've read the contribution guidelines and wholeheartedly agree

I've found a bug and checked that ...

• ... the problem doesn't occur with the mkdocs or readthedocs themes
• ... the problem persists when all overrides are removed, i.e. custom_dir, extra_javascript and extra_css
• ... the documentation does not mention anything about my problem
• ... there are no open or closed issues that are related to my problem

Description

I have enabled header.autohide under features. Header gets hidden as expected, but horizontal scrollbar appears after that.

Expected behaviour

Horizontal scrollbar should not appear.

Actual behaviour

Horizontal scrollbar appears.

Steps to reproduce

1. Enable header.autohide under features.
2. Open a long page.
3. Scroll.

Package versions

• Python: 3.9.2
• MkDocs: 1.2.2
• Material: 7.2.4

Configuration

site_name: Group for apps and services on exascale research infrastructure
site_url: https://group.miletic.net/
theme:
  name: material
  features:
    - header.autohide

System information

• Operating system: Android
• Browser: Latest Firefox and Chrome

I have successfully reproduced it on Chromium 90.0.4430.212 and Brave 1.28.105 on Linux using latest MkDocs version and minimal config posted above. It doesn't seem to happen in Debian's Firefox 78.13 ESR.

I'm attaching a recording made in Brave responsive view of the bug appearing on the public version of the docs. The public version is compiled using 7.2.3, but the bug happens in 7.2.4 as mentioned above.