Materialize: Fixed navbar jumps while showing sidebar, modals, date picker

[ezienecker]

Description

The content of a fixed navbar moves to the right in browsers on Windows (Firefox, Chrome) when the browser scroll bar is hidden due to sliding in sidebar, modal dialogs or date picker.

Repro Steps

1. Use Firefox or Chrome on a Windows desktop
2. Go to https://codepen.io/anon/pen/GmEmgQ
3. Click on "Menu"

Additional Information

This does not happen if the navbar is not fixed (i.e. no position:fixed).

[DanielRuf]

Looks right as the scrollbar is hidden and so the available width is greater (the 70% width)

[ezienecker]

For me as a user it feels buggy because e.g. the sidebar is an overlay and as such not pushing content away. So I expect virtually no jumps of unaffected content (like this: https://contributor.google.com/v/signupdisabled).

[DanielRuf]

Well, take a closer look where the scrollbar starts ;-)

[ezienecker]

That's true for the header but the body content here doesn't jump because the scroll bar isn't hiding. Could this be a solution? To not hide the scroll bar (maybe optionally) if the side bar or modals are displayed?

[weiweilaogong]

can you speaks chinese？

[ezienecker]

here is a possible solution: 4686

Default behaviour: https://codepen.io/anon/pen/GmEmgQ

Behaviour without jumps: https://codepen.io/anon/pen/XRYZMp

[Nikitozz13]

Have issue when fixed navbar jumps under the status bar when I open camera to take a picture or choose it from photo library on iOS.

Before:

Choose image:

After choosing and dismiss:

[Dogfalo]

Added an option in sidenav and modal in a9a87f4f9cec5e7412a097a132c64cb8ff671663