meta name=”viewport”の重複でハマる

スマホサイト作る時は必須ぐらいのmetaタグ「viewport」。
これでちょっとハマったのでTips的にご紹介。

スマホサイト制作で、以下のようにviewport指定を入れることが多いと思います。

<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no,minimal-ui">

1	<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no,minimal-ui">

今回も上記のように指定をHEADタグ内にいれて、iPhoneで確認してました。

が、minimal-uiが効かない現象が発生。
指定してるけど、なぜか効かない。。。

ソースを再度確認してみると、上記指定の下にSSIでviewportが挿入されてるのを発見しました。
そちらの方には「minimal-ui」がないという。

つまり、viewport指定は後勝ということですね。
通常ではあまり遭遇することないですが、外部からSSIとかで
モジュールを入れ込まれる際などは気をつける必要あると思いました。

ちなみに、「minimal-ui」iOS8から効かなくなってるようです。
画面が大きくなったからなのかどうなのか。。。