New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
x/website: spaces in preformatted blocks (as rendered from Markdown) are unintentionally collapsed #41507
Comments
This issue affects Chrome on macOS too: There's some relevant CSS:
I think that was meant for inline code (like /cc @jayconrod |
According to MDN CSS option The solution here should be to remove |
As far as I know, the <code> tags in <pre> tags are generated by our Markdown renderer. (This needs to be confirmed.) If it is reasonably clean to modify the Markdown renderer (either by adjusting its configuration, or by updating to a newer version that improves this behavior), then I agree this is likely a better solution. Otherwise, there's no option but to fix this by changing the CSS selector. |
I can confirm those |
Yep, the In contrast, the CSS fix is very simple, just requires adding a diff --git a/content/static/style.css b/content/static/style.css
index 1adea2d..c4ffa39 100644
--- a/content/static/style.css
+++ b/content/static/style.css
@@ -98,6 +98,9 @@ code {
* spaces tend to be wider than proportional font spaces. */
word-spacing: -0.3em;
}
+pre code {
+ word-spacing: 0;
+}
pre {
line-height: 1.4;
overflow-x: auto; So my suggestion would be to just run with what Goldmark produces (other Markdown renderers produce |
Thank you for investigating this and sharing your findings @benhoyt. It's very helpful. I agree with your suggestion. I would add one more optional part to it: it may be worth to also make a feature request in goldmark's issue tracker about changing its default HTML output, and see what they think. I tried to look into CommonMark specification and it consistently shows the use of |
Interesting re CommonMark spec. I've found several sites that suggest
I guess that makes some sense. Though I'm sure the Markdown renderers just always do In any case, seems like we have a simple CSS way forward. |
Change https://golang.org/cl/271277 mentions this issue: |
@dmitshur Fix submitted at https://go-review.googlesource.com/c/website/+/271277 Before and after screenshots below. I've also tested that this doesn't mess up other documentation/spacing, for example the pkg documentation. Current version: After fix: |
We have "word-spacing: -0.3em" for <code> in our CSS, but that causes Markdown code blocks to have misaligned spacing. Markdown renders blocks in <pre><code>, so this change updates the CSS to override the word spacing back to zero for code blocks. (We use the goldmark package, but other Markdown renderers produces <pre><code> too.) Fixes golang/go#41507 Change-Id: Ic5262dfe006d1206843575975885deb1c14e5c75 Reviewed-on: https://go-review.googlesource.com/c/website/+/271277 Run-TryBot: Dmitri Shuralyov <dmitshur@golang.org> TryBot-Result: Go Bot <gobot@golang.org> Reviewed-by: Dmitri Shuralyov <dmitshur@golang.org> Trust: Jay Conrod <jayconrod@google.com>
What did you do?
Visited https://golang.org/ref/mod with Edge 85 on Windows 10
What did you expect to see?
Spaces in code examples should distinguished without problems.
(The following image is captured with modified stylesheet)
What did you see instead?
Spaces in code examples are too collapsed to read.
The text was updated successfully, but these errors were encountered: