Last modified: 2014-04-29 04:09:29 UTC
Observed on LG P500's default browser (See https://twitter.com/#!/JamesFortengard/status/202110775593140224) and HTC Desire 2.2.2
This was likely fixed with the latest deployment - that user's tweets were from the day before we pushed out the changes that addressed this and similar issues.
It's possibly fixed... Either way there are still problems with the HTC Desire 2.2.2
Actually, it appears not to be fixed :( I just looked at the HTC Desire in perfecto. I only quickly checked the San Francisco article on enwiki, and content in the principle infobox is clipped and there does not appear to even be a horizontal scroll. Also, when typing in the full screen search box, a secondary box appears, floating just above the input box. As you type into it, the letters appear in both boxes simultaneously. Very strange.
It seems on HTC Desire 2.2.2 that zooming out (via pinching) reveals the table unclipped. Although this is not obvious this seems to be a browser limitation... but at least it can be read. I checked on mine and couldn't find the problem on the HTC Desire in perfecto. The search problem is due to some default styling on focused elements. I'm yet to find a way to remove that.
Certain older browsers do not allow scrolling of tables. We also experience this problem on the mobile app which does not allow zooming. We should think of a more creative solution for dealing with these browsers.
Worth a read - http://css-tricks.com/responsive-data-tables/
Idea, replace inline table with "button". Click it, open new window, wider than normal screen resolution (1024 wide or 6 * screenwidth ?) by default on 1:1 zoom level but allow user zoom. Draw the table in this wider canvas. The canvas will take care of the scrolling behavior. Potentially add some logic to only do it on tables with more than x columns. This should fix the above problems and probably result in nicer reading experience overall.
More feedback on this issue: Pages dont scroll sideways anymore neither in the app nor in safari. Content on the right of page cannot be read! Please solve. User-agent: Mozilla/5.0 (iPhone; U; CPU iPhone OS 4_2_1 like Mac OS X; en-us) AppleWebKit/533.17.9 (KHTML, like Gecko) Version/5.0.2 Mobile/8C148 Safari/6533.18.5 #####
http://en.m.wikipedia.org/wiki/Departments_of_France#section_4 Is an example of an effected table
We also need to consider how best to serve mobile phones that get the basic site e.g. Opera Mini as these will not have javascript...
I've been told that Opera Mini 7 does not support scrolling tables either
More examples: http://en.m.wikipedia.org/wiki/Quantum_electrodynamics#section_3 (latex equations)
(In reply to comment #12) > More examples: http://en.m.wikipedia.org/wiki/Quantum_electrodynamics#section_3 > (latex equations) In this case we're supporting the users phone iPhone OS 5_1_1 but are not indicating that the table is scrollable. Adding a visual indicator would fix this. I'd open a bug about this but keeping the discusion localized per Jon.
It's worth mentioning that we could have a button that writes the table to a window so that the reader can view it in full screen $("table").dblclick( function() { var win = window.open(); win.document.write( '<table>' + $(this).html() + '</table>' ); } )
The Wikipanion iphone app does this.
"When displaying on a mobile device, the third column is cut off, so where the article says there are 17 states entirely within the eastern time zone, only the first 12 can be seen. This is not a problem on the full webpage." http://en.m.wikipedia.org/wiki/Eastern_Time_Zone#section_3 User-agent: Mozilla/5.0 (compatible; MSIE 9.0; Windows Phone OS 7.5; Trident/5.0; IEMobile/9.0; NOKIA; Lumia 900)
*** Bug 29504 has been marked as a duplicate of this bug. ***
I started capturing this as a story in the hope it will get more fleshed out and clearly defined what needs to be done - https://mingle.corp.wikimedia.org/projects/mobile/cards/138
A really good example of a large table is: http://en.m.wikipedia.org/wiki/List%20of%20United%20States%20presidential%20election%20results%20by%20state#section_1 (huge!!!)
We are now making several attempts at fixing this problem: https://gerrit.wikimedia.org/r/#/c/39343/
This is deployed to the alpha version of the mobile site (access through settings page and opting into beta) Feedback welcomed..
Marking as assigned; Michelle will be testing.
Id argue this is not really assigned. It is still a bug in stable and the implementation in alpha needs work.
I checked in perfecto mobile and this is still broken on en.m.wikpedia
*** Bug 52939 has been marked as a duplicate of this bug. ***
I suspect we will need to tackle the problem of tables on a template by template basis. Infoboxes seem the obvious first point of attack but it would be good to get an idea of what the most widely used templates are.
*** Bug 53524 has been marked as a duplicate of this bug. ***
(Note although this bug started as a specific issue to do with clipping it is now effectively a tracking bug for broken tables across the mobile site)
*** Bug 52572 has been marked as a duplicate of this bug. ***
(In reply to comment #29) > *** Bug 52572 has been marked as a duplicate of this bug. *** So it's weird... yesterday morning I could repro this bug, but then last night the bug stopped repro'ing. I literally have two tabs open on my phone -- one with the repro and one that renders as desired. Was there a fix that went in for this yesterday?
I think the bug you were referring to was bug 49440 which was resolved and deployed yesterday. The table issue is more generic and covers a broad set of tables that rely on widths that do not render nicely on mobile.
Thanks Jon. I had originally filed Bug 52572, which was duped to this bug. But the issue I had filed now appears to be fixed. So it looks like it was really a dupe of 49440, rather than this one. In any case -- thank you!
Prioritization and scheduling of this bug is tracked on Mingle card https://wikimedia.mingle.thoughtworks.com/projects/mobile/cards/1694
*** Bug 64516 has been marked as a duplicate of this bug. ***
This bug is invalid, both title and description carry no useful information whatsoever. If you follow the text, you come to the conclusion that the bug is about tables in HTML being observable on mobile devices. Please consult the document "How to report a bug" at <URL: https://m.mediawiki.org/wiki/How_to_report_a_bug >.
Admittedly the initial description of the bug was poor, but the discussion describes the problem and outlines several possible solutions. This is a MAJOR issue of the mobile platform and has been reported multiple times. The bug report needs to remain open until this is truly fixed.
I've done a better job of summarising on bug 64577 hopefully that will inject some new life into solving this bug :) *** This bug has been marked as a duplicate of bug 64577 ***
