Board Thread:Support Requests - Getting Technical/@comment-24450419-20151122021730/@comment-24473195-20151124193823

Saftzie wrote:

Dessamator wrote:

I think most people here have gone slightly off topic. If you want to make your template portable (mobile-friendly), you need to consider changing a few things:

At Wikia, CSS does not work at all for mobile.
 * Remove all inline CSS, put it in a wiki-wide CSS, and use a class
 * ... [snip] ...
 * The template could use   and  tags instead of tables to show the content, although you may need to change the CSS accordingly (see http://www.w3.org/TR/html401/struct/lists.html#h-10.3).
 * The markup parser strips out inline CSS.
 * The WikiaMobile skin ignores all MediaWiki and personal CSS files.
 * It also doesn't run MediaWiki or personal JavaScript, so you can't load CSS from there, either. Neither are there jQuery or mediaWiki globals loaded (e.g., mw.loader, mw.config).
 * What WikiaMobile does load is their Mercury, which hacks up JavaScript DOM prototypes, so even if you open a browser console and try to load CSS from there, it'll refuse, sometimes with an error and sometimes silently.

WikiaMobile loads two stylesheets, and that's all you get.
 * A very small inline (via ) stylesheet
 * The Mercury stylesheet (via )

You might have some success with Lua. I don't think there's a way Mercury can stop Lua from adding styles to HTML is generates, but I've never tried. I guess it depends on whether Lua adds HTML after the parser runs or before. Nope, Lua simply outputs strings which MediaWiki parses. So they can also remove any inline styling from it.

My point was that tables will show up much worse than a  list. Even without CSS it will render better than with those tables. Also mobile is a very broad term, it is possible that tablets or mobile devices using other form factors display the inline styling and render the content horribly.