iOS9のSafariでスマホサイトが縮小表示されてしまって困った！

少し前にリリースしたレスポンシブ対応のサイトで、iOS9にアップデートしたSafariで閲覧すると表示が崩れてしまう事案が発生しました。
iOS８のSafariと、iOS9のChromeでも問題なく表示されていました。

調べたところ、同じような症状を解決したとの記事をすぐに見つけられて無事解決できたので取り急ぎメモ。

どんな症状だったか

上の画像左のように表示されるのが正解だとすると、画像右のように内容が縮小されてしまっていました。
htmlは簡略化するとこんな感じの内容です。

テキストテキスト

divの背景にCSSで画像を表示（背景画像はdivのサイズより大きい）、その上(divの中)にposition : absolute;で位置指定したテキストを配置していました。

縮小のされ方からして、背景の画像がdivからはみ出している部分が描画はされていないけど主張しているのではないかという推測です。

body{
    position : relative;
    width : 100%;
    overflow-x : hidden;
}

上記のコードを記述で解決したとのことでしたので、早速bodyにCSSを追記。ブラウザをリロードしたところ、見事に縮小表示が直っていました。

追記した3行が全て必要なのか？と思い、試してみたところ、今回私が遭遇した現象では、overflow-x : hidden;だけの記述で縮小表示の修正ができました。

諸事情あって強引なCSSの記述が災いしたのだと思います…。反省。