iphone,ipad の safari　でのレイアウト崩れについて

Question

お世話になります。パラボッセの内堀です。

スタイルシートを利用してページのレイアウトをしています。
PC での表示では思った通りにできたのですが、iphone,ipad で確認するとレイアウト崩れになってしまいます。

恐れ入りますが、修正方法を教えていただけましたら幸いです。

環境はギガファイル便よりご取得いただければと思います。
http://17.gigafile.nu/?h646483a57074a0dd638e3a102a4da002-1125
パスワード：1118
インターネットでは以下の URL でご確認いただけます。
http://shopping.geocities.jp/paravoce/head.html

レイアウトが崩れてしまうのは、head.html 内の 21行目から25行目の…の部分です。

説明不足な点がありましたらご連絡いただけますと幸いです。
お忙しいところ恐れ入りますが、どうぞよろしくお願いいたします。

Answer

PCとiPhone/iPadでは、文字の大きさ（ページに対する大きさの割合）が違うため、
内にある
各の、左側に配置されるテキストが長すぎて
右側のタグの位置に食い込んでしまうのが原因です。

・左側のテキストの文字サイズをさらに小さくする
・の横幅を広げる
・左側のテキストの途中に改行を入れ、
  右側のタグを左側のテキストの前に移動して、
  同タグのline-heightをテキストの2行分に設定する。

などの方法で、修正していただけますでしょうか。

Answer

ありがとうございました。

iphone,ipad の safari でのレイアウト崩れについて

iphone,ipad の safari　でのレイアウト崩れについて