日報 #61 - IE8にremは効かねぇ、iphoneでiframeはスクロールしねぇ

飼ってるインコに求愛される日々です。
Webリニューアルをちこちこと進めています。
それに伴い本日未明、iphone safariとIE8周りという地雷原で、 2個ほど罠を撤去したのでご報告いたします。

iPhone Safariのiframeはスクロールしねぇ

びっくりしたが本当の話だ。
基本的にiframeなんて認めない！っていう態度なんでしょうけど、
そうもいかないので対策します。
「divでくくってoverflow: scroll; 」
はい、とても簡単ですね。

IE8 で rem は効かねぇ

ムカついたが本当の話だ。
基本的にCSS3を認めない！っていう態度は分かる。
IE8の世界観からすればはるか未来の話だしな。
むしろ世界中にいるIE8ユーザ様方、お願いだからアップデートしてください…
さておき、
CSS3に対応させるテクい方法論はいくらでもございます。
有名ドコロはこれですね。

<!--[if lt IE 9]>
  <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->

これで世界が平和になると思っていた時期が僕にもありました。
しかして、これだけではIE8の絶壁は超えられません。
表示がグチャグチャです。
modenizerも試しました。responde.jsも試しました。ie9.jsも。selectivizrも。
それでも世界はグチャグチャでした。
そして気づきます。
「なんでfont-sizeのCSSすらも無視されてるんだ…？」
ホームズもびっくりの名推理によって僕はremが効かないことに気づくのでした。
そうと決まれば、Googleが解決してくれます。
REM-unit-polyfill.js
https://github.com/chuckcarpenter/REM-unit-polyfill
こんなものがあるそうです。
ありがたいことですね。

<!--[if lt IE 9]>
  <script src="/hoge/REM-unit-polyfill.js"></script>
  <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->

これにて一件落着です。

あんま予想していないところでハマるとどっと疲れます。
少しでも転ばぬ先の杖になれば、これ幸いでございます。。。
ではでは、今日もひとつ、かしこになれてご満悦です。