スマホヘッダーの余白についての質問

Question

いつもお世話になります。
スマホヘッダーを作ってみましたが、
余白が多すぎて、もとのショップ名も見えなくなりました。
直し方教えていただけますか？

Answer

ECマスターズの伊藤です。

> 余白が多すぎて、もとのショップ名も見えなくなりました。
> 直し方教えていただけますか？

修正箇所を下記にまとめましたので、
ご確認をお願いいたします。


iframeの高さを(height)調整してください。
(350程度かと思います。)
＝＝＝＝＝修正前＝＝＝＝＝

＝＝＝＝＝＝＝＝＝＝＝＝＝


sample.cssの下記3箇所の修正をお願いいたします。

＝＝＝＝＝修正前＝＝＝＝＝
.itemtitle,.ctgTtl1,#campaignText,#itemFestival{
     display: none;
}
＝＝＝＝＝＝＝＝＝＝＝＝＝
.itemtitle,　で店名を非表示にしていますので、削除してください。

＝＝＝＝＝修正前＝＝＝＝＝
#itemImageSlider{
     margin-top: 480px; /* ①商品ページのコンテンツを下にズラす */
     }
＝＝＝＝＝＝＝＝＝＝＝＝＝
margin-topをiframeと同じ高さにしてください。

＝＝＝＝＝修正前＝＝＝＝＝
.sample{
     position: absolute; /* ③sampleクラスのdivボックスやiframeパーツをページ全体から相対位置指定 */
     top: 155px; /* ④店舗独自ヘッダーの画面トップからの距離を指定 */
     left: 0;
     width: 100%; /* iframeの場合横幅をwidthで指定すれば不要 */
     }
＝＝＝＝＝＝＝＝＝＝＝＝＝
topを190pxにしてください。

Answer

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

Answer

ECマスターズの伊藤です。

無事ご解決できたようで安心致しました。

またご不明な点がございましたら、ご相談くださいませ。