はてなブックマーク

iPhone7（iOS 10.3.2）でTwitterの公式ウィジェットを貼り付けたサイトを確認したところ、iframeが親要素の幅を超えてはみ出す事象に出くわしました。 iPod touch 5th（iOS 10.3.2）では発生しないという不思議な現象・・ ググると同様の報告がいくつかあり、おそらくiOS特有のバグとのこと。 おそらくそうでしょうし、safariのバージョンやら何やら調べたところで崩れた原因の特定に至ることはなさそうと判断し、修正方法を模索することにしました。 同様の報告のあるサイトの情報によると、iframe に width:100%; を指定すると崩れる（拡がる）とのことで、確かにiframeのstyleにその記述が出力されている・・（公式ウィジェットが出力するソース）。 他の方の解決方法は、メディアクエリーで固定幅にしてしまう、というものでしたが、レイアウトの都合