スマホgoldページの画像の崩れについて

Question

スマホ用に作ったgoldページについてですが、画像を3枚横に並べているのですが、3つとも画像の大きさが異なってしまいます。
（i phoneのみの確認ですが。）

<head><meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.5, user-scalable=yes">
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"></head>

上記のタグを入れているのですが、文字の大きさは揃っているのですが、画像がどうしても大きさが異なってしまいます。
今の状態は、左がかなり大きく表示され、真ん中、右の画像が小さく表示されています。

色々調べてみたのですが、解決策が見つからず質問させていただきました。

よろしくお願いいたします。

Answer

追加のコメントです。画像は1つ1つ width="100%"　で指定しています。

Answer

ECマスターズの田中です。画像を１つ１つ width="100%" で設定して、画像を3枚横に並べられているということは、タグで囲い、

タグに入れて並べられている形でしょうか。その場合、

タグに幅を指定しないと、ブラウザによる判断で幅が決められます。

タグに均等に幅を割り振るには、タグに style="table-layout:fixed;" 属性を付加してください。例えば、

↓

このような記述になります。その他の方法で画像を設置されている場合は、私にて実際のページを確認させていただく必要がありますので、GOLD内のどこに入っているか、フォルダ名・ファイル名をお知らせいただけますでしょうか。

Answer

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

スマホgoldページの画像の崩れについて

カテゴリーから探す