Bootstrap: New documentation rendering issues on MS Edge 15.0

[rosieks]

It looks that new documentation doesn't look well on MS Edge 15.15063 / Windows 10
Bellow I've attached screenshots:

[Johann-S]

I confirme Edge and Win10 too

Edit:
It seems a well known not implemented feature in Edge see : https://developer.microsoft.com/en-us/microsoft-edge/platform/status/positionsticky/

[mdo]

Hmm, I thought I accounted for this in the docs. I'll take another look.

[mdo]

Can you confirm you have the latest from v4-dev, and the version of Edge? I don't have Edge 15 on my VM.

[patrickhlauke]

Yes, confirmed

[Studio384]

If this is due to position: sticky not being supported, than it is fixed as of Edge 15.16215 which does support that, so this would be fixed in september for non-preview users when Edge 16 launches.

[Johann-S]

For Windows insider preview yes see : https://developer.microsoft.com/en-us/microsoft-edge/platform/status/positionsticky/

[mdo]

I've updated my VM and still don't have that version, hmm. Will need to look into it more still.

[Studio384]

@mdo: what version do you mean? Edge 15.15063? You can force it to upgrade with the Windows Upgrade Tool.

[mdo]

Yeah, for Edge. I'll take a look at the force upgrade. Running Windows Update wasn't cutting it for me.

[mdo]

I thought I had found a way to work around the bug in position: sticky with some @supports action. See https://github.com/twbs/bootstrap/blob/v4-dev/assets/scss/_sidebar.scss#L51-L68. Basically Edge and IE11 are rendering it as position: relative and thus applying the top offsets. My intent was to only apply those styles if it was fully supported. Might not be working completely.

[Studio384]

This will help you get your VM to the latest stable release so that you can test it out: https://www.microsoft.com/en-us/software-download/windows10.

[mdo]

Working on the update, but here's what I see on Edge 14 for posterity.

[mdo]

Works on my machine! lol

[JohanSellberg]

Works well for me as well on MS Edge 15.15063 / Windows 10.

[patrickhlauke]

just to check: did you scroll down a bit, maybe follow an in-page link, then scroll back up? can't test right this second, but i seem to remember the issue became apparent only after page/scroll interactions

[craigpotter]

It isn't sticky or fixed for me on scroll but other wise works ok.

[JohanSellberg]

@patrickhlauke I have tried that now and I am unable to reproduce the same issue that @rosieks reported. But as @craigpotter points out it is not fixed or sticky when you scroll. (also @craigpotter that is in version 14, issue should be in 15.15063 ? )

[craigpotter]

@Johann-S Ah I assumed I would already have the update ... Doh! My bad. New Issue or side effect?

[Johann-S]

@craigpotter it's the same issue 👍 sticky position isn't applied

[patrickhlauke]

Confirming that the issue of the gap appearing at the top of the left-hand navigation, per the issue starter, is now not present anymore.

As for position:sticky, this is likely to come in future versions of Edge - see https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/10982527/ and https://developer.microsoft.com/en-us/microsoft-edge/platform/status/positionsticky/?q=sticky

[mdo]

When it comes to Edge, it should just work provided everything happens as intended with @supports.