Last modified: 2014-09-20 22:28:29 UTC
Go to: http://en.m.wikipedia.org/wiki/Category:Massacres_in_Iraq This displays terribly on a small screen as the HTML markup is a table. If a 3 column layout is really wanted the column-count css rule should be used on a single list element.
Any change should also introduce the column-count css property via a media query so it renders nicely on mobile.
does column-count render well on IE now a days? (The original reason for table was it was made well before there was any browser support for css columns).
No only in 10 [1]. but does this really matter? As a single list the category list is still readable on IE albeit long. Currently however it is /not readable/ on a mobile phone (320px resolution). You wouldn't spend time worrying about making an old black and white TV spend time showing HD movies so why would you spend time worrying about making column-count work on IE...? [1] http://caniuse.com/multicolumn
Currently 12.63% support (according to link.) More importantly, from that source none of the mobile browser have complete support except Opera mini. ("Note: Partial support refers to not supporting the break-before, break-after, break-inside properties. Webkit browsers do have equivalent support for the non-standard -webkit-column-break-* properties.")
I think the main thing I'm trying to get at is don't use a table and instead use something that falls back to a single column (the same effect could be made using 3 DIVs) On mobile it doesnt matter if the column-count property doesnt work as this will simply show a single list which is the needed behaviour there anyway.
Actually the user should be able to adjust the number of columns shown in his preferences. Me for example often works in categories with typically long article's names which unnecessarily break lines, others might have other preferences because mainly work with categories in which article names are mostly short.