コンテナ幅1200pxのサイトを iPad でぴったりと表示する方法

Question

PC向けレイアウトの最小幅が1200pxのサイトを作成しています。
ウィンドウ幅が767px以下になるとスマートフォン向けのレイアウトに変わるようになっています。

ipadで表示するとPC向けレイアウトで表示されるのですがコンテナにwidth: 1200pxをしているためぴったりと収まらずはみ出してしまいます。

良い方法をご存じのかたはいらっしゃいますでしょうか。

Answer 1

767px から 1200pxまでの画面幅のためのスタイルをメディアクエリで指定してはいかがでしょう。

【レスポンシブの基本、メディアクエリの書き方 | それからデザイン スタッフブログ】
http://sole-color-blog.com/blog/php/71/

Answer 2

固定幅前提で作っているサイトを767-1200幅で可変幅対応するようにするのは場合によって
完全にその幅専用の新たなデザイン・レイアウトを検討しなければならないケースもあり、比較的手間がかかります。
もしその手間をかけるのが嫌なら、
UA判別してiPadの時だけviewportのwidthを1200pxに固定するとかもアリかもしれません。
（Androidタブレットはどーすんだ、って話もありますが・・・／苦笑）

あと現在のメディアクエリでスマホレイアウトにするのが767px以下になっていると思いますが、
これを768px以下にすればiPadのポートレイトではスマホ表示となりますので、
割り切ってスマホ表示にしてしまうとかｗ