スマホサイト : してログ

IEでは meta の viewport 指定が効きませんが、CSS に書いても無視されるので何でかなと思っていました。 検索しても特にそんな報告は見当たらないし、みんな同じことしか書いてないので八方塞がりになっていました。 試行錯誤の結果、分かったことは「width=device-width」という書き方で問題なく、「width=1280」のような書き方では無視されるということ。 でも何となく「width=1280px」のように単位を入れてみたら、IE でちゃんと認識してくれました。 画面のサイズを指定するということで「入るのはピクセル単位だけ」という思い込みが、なかなかその考えに至らなかったということになります。

IE では下記のように書いても無視される
<meta name="viewport" content="width=device-width">
有効なCSSの記述例
@-ms-viewport {
  width: device-width;
}
無効なCSSの記述例
@-ms-viewport {
  width: 1280;
}
有効なCSSの記述例(単位pxが必要なだけ)
@-ms-viewport {
  width: 1280px;
}