yahooストアクリエイターpro

Question

お世話になっております。
スマートフォン情報の箇所に、下記記載のHTMLを登録したいです。
このまま登録するとPCサイズになってしまうのですが、スマホサイズにするにはどのようにすればよろしいでしょうか？
↓↓↓

Answer

ECマスターズの田中です。

Yahoo!ショッピングのスマートフォン用ページには、
タグのcontent属性にて
width=device-width
と定められておりますので、
各機種のブラウザの横幅が、そのままHTML全体の横幅となるのですが、
ブラウザの横幅は機種によって異なってまいります(*)。

横幅が確定しない状態で、各要素の横幅を固定値で指定すると、
どうしても機種によって、足りなかったりはみ出たりと
変動してしまいますので、
割合で横幅をご指定いただきますようお願いします。
その際、高さの指定を削除することで、
画像本来の縦横比を維持することができます。

例）

↓


＊：
主な機種ごとの横幅は、
下記サイトにDEVICE WIDTHとしてまとめられておりますので
参考までに一度ご確認ください。
http://screensiz.es/phone

Answer

ご返答ありがとうございます。
サイズの件は解決しました。
追加でご質問ですが、Yahoo!ショッピングのスマートフォン用ページに下記を張り付けて、
実際のスマホページで確認した際、4か所程、大きな隙間が出来てしまいました。
こちらをバランスよく縮めて並べるには、どのようにしたらよろしいでしょうか
↓↓↓

Answer

ECマスターズの田中です。

ソースに４箇所含まれている、縦横１ピクセルの



が横幅まで拡げられた結果、
横幅と同じサイズの隙間が作成されておりますので、
削除、もしくは適切な高さをご設定ください。