Firefox css bug in the menu of the dashboard example

[rafatga]

Preconditions

• MacOs High Sierra 10.13.2
• Firefox Quantum 58.0.2 (64-bit)

Bug Example

• http://getbootstrap.com/docs/4.0/examples/dashboard/
• https://codepen.io/rafaterangautier/details/yvERya

Expected result

The first element (li) of the side menu should be "Dashboard".

Actual result

The first element is being hidden under the main top navbar.

[Johann-S]

Bug reports must include a live demo of the problem. Per our contributing guidelines, please create a reduced test case via CodePen or JS Bin and report back with your link, Bootstrap version, and specific browser and OS details.

[rafatga]

Hi @Johann-S,
I have included a new section in the issue where I added the links of the test case.

[weberlance]

FireFox 49.0.1 (win7 enterprise sp1) have the same view.
I think that problem is in "sidebar-sticky" class. It looks like modifier of sidebar but we use it in context of sidebar.
And in this case it's better to use just relative position instead of sticky(I think that it's impossible to use correct .sidebar-sticky without .sidebar parent/ancestor).

For IE11 there is another problem.
According to _position.scss IE doesn't understand @supports at all and properties top, z-index are missed too. And there is no fallback like "position: relative".

Also in dashboard.css there is no "@ supports" rule and is the cause of errors in IE.