This won’t work for every site, but for a large number of sites like this one, where the focus is on actual documents (e.g. blog posts, wiki articles…) I have an easy way to make your website work beautifully on mobile devices. Ready for it?
- Add
<meta name="viewport" content="width=device-width" />to your<head>element. This gets around a quirk with mobile browsers, full explanation here. - Delete all of your css.
- Realize that the whole point of HTML was device independence, and if we’re having difficulty making something work both on a 13 inch screen and a 4 inch screen, something is deeply wrong.
I earnestly believe that for most document-oriented websites, css usually makes things worse.
That is all.