google chromeとAndroid Browserの最小フォントサイズ制限について
このブログでも何度か紹介している、佐藤ねじさんからのご依頼で
これ作ってました。見ての通りミニマムなので、作業量もミニマムだろと思ってたら少しハマったので記しておく。
タイトルの通り、google chromeとAndroid Browserには最小フォントサイズ制限という設定があります。
chromeは10px、Android Browserは8pxです。
chromeはchrome://settings/fontsここで確認できます。
こんな感じで。
Androidは手元にないので試してないです。
今回作ったサイト、cssのfont-sizeに4pxという値を当てているんですが、この制限のせいでchromeは10px、Android Browserは8pxに表示が強制されてしまいます。
仕様の意図としてはきっとそんなに難しくなくて、web制作者の意図しないミスへの対応とか、ゆーざーいんたーふぇいすとかいう話なんでしょうね。
ちなみにこの設定、chromeもAndroid Browserも設定から変更できるんですが、webページのjsからは変更できません。できたら面白いんですがね。
(余談ですが、chromeのwindowオブジェクトに生えてるchromeってオブジェクト、使ってなんか面白いことできないんですかね)
と、いうわけで世界一小さいサイトを作る上では、この2者をUserAgentで判定し、transform: scaleで無理やり小さくしています。フォントがガビガビになっちゃわないかなと思ったんですが、意外と上手くいきました。
きっと今後一生使わないであろうTipsですが、まぁ今回僕が使ったので、誰かしら使うんでしょう。
今日もぼっちですが、uupaa氏のuniteplayer(UnitePlayer.js 作ったよ - latest log)がiOS7 safariで動かないみたいな話を聞いたので、オレオレオーディオスプライトライブラリでも作ろうと思います。でもなんとなく詰みそうな気がしてるので、Soundcloud APIでなんとかできないかなとか思ってます。
なんかいつも、暇があると音かセンサー系で何か書いてる気がする
