スマホ画像について

Question

スマホＧＯＬＤに載せている画像ですが、 width="100%"　で画像を載せても、左に画像が寄ってしまいます。
解決策がありましたら、教えていただけないでしょうか。
宜しくお願い致します。

Accepted Answer

ECマスターズの田中です。

ソースを確認したところ、JavaScriptによって、ページ読み込み後に
「width="100%"」が、強制的に（ウィンドウの横幅-20、iPhoneの場合300pxまたは460px）の値に
書き換えられておりました。

===== この下の行から ================

// 画像のサイズを（画面幅 - 20px）にする
ImageSizeChanger.config.margin = 20;
// ISCを起動する
ImageSizeChanger.set();

===== この上の行まで ================

上記タグが原因なのですが、
このタグを記載された目的をご確認いただき、
外す事ができない場合は、とで画像を囲うなどして、
現在のサイズのまま中央揃えにすることをご検討ください。

Answer

ECマスターズの田中です。

＞width="100%"　で画像を載せても、左に画像が寄ってしまいます。
タグに対して、のように
HTML属性としてご指定されているということでしたら、
２点ご確認いただきたい点があります。

HTML属性は、同じ意味のスタイルシートが適用されると
必ずスタイルシートに上書きされてしまいます。
タグにスタイルシートをsytle属性で直接記入すると
さらに上書きをすることができますが、
多用しすぎると、一括でのサイズ変更が難しくなるのでご注意ください。
例）

また、width="100%"の「100%」は、
「自分を中に入れている、親関係にあるHTMLタグの横幅」
に対する割り合いを意味しております。

例えば、







このようなHTMLソースがあった場合、
タグはページ全体の横幅の8割で表示され、
タグはタグの横幅と同じ横幅になるので、
タグもページ全体の横幅の8割で表示されます。

タグの親関係にあるHTMLタグがどれくらいの横幅か、
それを画面全体に拡げることができるか、
ご確認をお願いいたします。

以上の考え方でもうまく修正ができない場合は、
実際の表示を確認の上アドバイスさせていただきますので、
表示が確認できるGOLD内のページのURLをお知らせください。
（「http://www.rakuten.ne.jp/gold/ショップURL/」より後の文字列だけで結構です）

Answer

大変お手数おかけいたしますが、修正箇所を教えていただいてもよろしいでしょうか。
*****
になります。

宜しくお願い致します。

Answer

ECマスターズの田中です。

お知らせいただきありがとうございます。
（念のため、投稿内容を一部伏せ字にさせていただきましたのでご了承下さい）

今回お知らせいただいたのは、「ショップURL」の部分になりますが、
トップページに埋め込んだ画像ということでしょうか。

私にて、スマートフォン用トップページを確認いたしましたが、
width="100%" に設定されており、かつ、左寄せで表示されている画像が
見当たりませんでした。

お手数ですが、
実際の表示を確認させていただく必要がありますので、
再度、画像の表示が実際に確認できるURL（ショップURLの部分は伏せ字で結構です）、
もしくは左寄せで表示されている画像のスクリーンショット（または文章での説明）を
ご返信いただけますでしょうか。

Answer

上の部分でＤＥＡＬ等のイベントバナー等は左寄せになってしまっていのを、中央寄せにしています。
ＧＯＬＤページの下の部分は左寄せのままになっている状態です。


      
     


  
    オトクな情報がいっぱい！
    ▼ メルマガ登録もお忘れなく ▼

Answer

100%で表示ができました。
ありがとうございました。