speced / bikeshed

:bike: A preprocessor for anyone writing specifications that converts source files into actual specs.
https://speced.github.io/bikeshed
Creative Commons Zero v1.0 Universal
1.1k stars 199 forks source link

TOC layout looks broken in Edge using default styling #1423

Closed sandersaares closed 5 years ago

sandersaares commented 5 years ago

I think this issue is best demonstrated by the screenshot comparing Edge on the left and Firefox on the right. Observe the bad layout of the numbers on the left.

image

I am using the W3C web service, no custom styles.

Document URL: https://dashif-documents.azurewebsites.net/Ingest/master/DASH-IF-Ingest.html

Source: https://raw.githubusercontent.com/Dash-Industry-Forum/Ingest/master/DASH-IF-Ingest.bs.md

dturnerx commented 5 years ago

I am experiencing the same problem. Does anyone have a solution?

dbaron commented 5 years ago

This seems to be a side effect of the grid-specific ToC styles; for example, removing this margin makes things a bit better. I wonder if things would be better if this @supports test were something that evaluated to false in Edge?

dbaron commented 5 years ago

I suspect it should be @supports (display: grid) and (display: contents); Edge's lack of support for display: contents seems to be causing the problem.

dturnerx commented 5 years ago

@dbaron Thanks for that. I removed the @supports (display: grid) section from my doc and it looks in Edge and Chrome.

dbaron commented 5 years ago

I'd also note that this issue only shows up for some specs because only some header.include files have a <style data-fill-with="stylesheet"> element.

Expand for the list of include files that have this element ``` ./audiowg/header-ED.include ./dap/header-ED.include ./geolocation/header.include ./header.include ./html/header.include ./httpslocal/header.include ./immersivewebwg/header.include ./mediacapture/header-ED.include ./ricg/header.include ./sacg/header.include ./serviceworkers/header.include ./tc39/header.include ./texttracks/header-CG-DRAFT.include ./texttracks/header.include ./webappsec/header-ED.include ./web-bluetooth-cg/header.include ./webgl/header.include ./webgpu/header.include ./webml/header.include ./web-payments/header.include ./webrtc/header-ED.include ./webvr/header.include ./wg14/header.include ./wg21/header.include ./wicg/header.include ```
Expand for the list of include files that do not have this element ``` ./act-rules-format/header.include ./audiowg/header.include ./csswg/header-ED.include ./csswg/header.include ./dap/header.include ./fxtf/header.include ./houdini/header.include ./i18n/header.include ./mediacapture/header.include ./svg/header.include ./test/header-DREAM.include ./test/header.include ./uievents/header.include ./wasm/header.include ./webappsec/header.include ./webapps/header.include ./webauthn/header.include ./webperf/header.include ./webplatform/header.include ./webrtc/header.include ./webspecs/header.include ./whatwg/header.include ./whatwg/header-RD.include ```
tabatkins commented 5 years ago

Ah, indeed, a lack of display:contents would def break things. Fixed.