#1774 Fedora Wiki's stylesheet is screwey on small screen high DPI devices
Closed: Fixed None Opened 12 years ago by ynemoy.

= phenomenon =

Multiple issues here: Tables go beyond the page but the page isn't told about being wider than the screen, so horizontal scrolling is not possible. Embedded pictures and headers aren't formatted properly so text can flow around it, even in extreme situations. The sidebar takes up too much space at high DPIs leaving only half the page for the body.

In the above order:



Resizing the text and page zoom fixes some problems, but my opinion is that this is non obvious to many people.


= reason =

I'm not much of a CSS guy, but i have a few ideas. First of all, the sidebar is strictly set to a hard size in relation to the rest of the page. Second of all, horizontal scrolling is (and rightly so) disabled at all costs. Third of all, something is not set properly when formatting embedded inline pictures, so that the sidebar can wrap around it, or so that it's left justified instead of right justified so it runs off the page rather than running into the sidebar.

= recommendation =

Wikipedia has a pretty decent mobile interface that works very nicely on the Android devices, and presumably on others as well. It avoids using a sidebar and TOC by replacing it with expandable fields. I think that at least having that stylesheet available would be a start. The tricky part is detecting the actual dimensions and DPI of a screen and switching to the appropriate stylesheet. In this particular example, the screenshots were taken on an XO using mostly stock settings and Firefox.

Another and more costly and time consuming solution is to redesign the page more comprehensively so that it is a general purpose page for both mobile, small screen, and normal devices.

I can't seem to get to the images anymore, so not sure this is still happening.

I think things are fine now with small screens.

Please re-open if you still are seeing issues.

Login to comment on this ticket.