Hi all
See this page: http://lilypond.org/macos-x.html
In the second column, second item of the ordered list, there's a
quite long line of code block. Same for the last code block in that
column.
The width of the code block is too short. This happens on all
browsers, of course. But you can scroll horizontally using the
scrollbar.
The problem is that certain browsers hide the horizontal bar, for
example Epiphany on Linux, Safari on Mac and Adblock Browser on
Android (see attached screenshot). This is annoying because Mac Os X
users will likely visit that page using Safari and feel confused
about that short line. This just occurred to me (I happened to use a
Mac laptop).
The width is fixed and set to 250px in the class `.h-scroll-auto` of
lilypond-website.css
The class is used only in that page:
~~~~
$ git grep .h-scroll-auto Documentation/web
Documentation/web/download.itexi:316:@divClass{h-scroll-auto}
Documentation/web/download.itexi:364:@divClass{h-scroll-auto}
~~~~
I think we can safely remove it.
The fixed width was introduced with below commit by Trevor in 2010.
I don't know how browsers behaved 8 years ago, but I can see now that
Firefox and Chrome will add a scrollbar automatically if the example
doesn't fit the space available.
If there's no objection and I'm not missing anything, I would send a
patch to remove the width from that CSS class.
Author: Trevor Daniels <address@hidden>
Date: Fri Aug 6 12:51:03 2010 +0100
Web: Issue 958 (partial) Scroll wide examples
- Examples on web pages which are divided into two columns
run off the right-hand edge when the width of the browser
window is reduced. This patch adds a horizontal scroll
bar to examples which do this.
diff --git a/Documentation/css/lilypond-web.css
b/Documentation/css/lilypond-web.css
index fd883b5b51..c101fd15ee 100644
--- a/Documentation/css/lilypond-web.css
+++ b/Documentation/css/lilypond-web.css
@@ -891,6 +891,18 @@ div.color4 h3 {
line-height: 0.8;
}
+.example {
+ position: relative;
+ left: -3em;
+}
+
+.h-scroll-auto {
+ position: relative;
+ left: 1em;
+ width: 240px;
+ overflow: auto;
+}
+
_______________________________________________
bug-lilypond mailing list
address@hidden
https://lists.gnu.org/mailman/listinfo/bug-lilypond
android-adblock-browser.png