トップページについて

Question

お世話になっております。
タグについての質問ばかりですみません・・
トップページについて、
・看板の画像のしたにどうしても余白が出てしまいます。
　どうすればここを狭めることができますか？
・以前、動画で紹介されていたショップのように(画像添付あり)
　アイテム画像を並べてみましたがタグが不安です。
どうしてもトップページは外注作成のページなので差し込み方がとても不安です。
通常は、で揃えて差し込みますが・・今回横に並べる為  で下記のように
組みましたが違うんじゃないか？と思い確認させて頂きました。
※現状PCではちゃんと並んでますが異なる場合、ほかプラウザでは崩れてる可能性もあるので。
※デザインレシピを見ましたが画像下に文字を入れないしその部分をどう排除して使用すればよいか
　分からなかったのでを使用するタグで作成しました。


  
    

この間に作成





すみませんがよろしくお願いします。###HR######IMG0b5a2172c2f5184aea2ec0f766f5bdac2.jpegIMG0###

Answer

ECマスターズの伊藤です。

> ・看板の画像のしたにどうしても余白が出てしまいます。
> 　どうすればここを狭めることができますか？

CSSにて、高さが指定されているのが
原因となっております。

ヘッダーに記載されていると思いますので
下記2箇所の削除をお願いいたします。

h1 {
    position: relative;
    top: 0;
    left: 0;
    width: 190px;
    /* height: 110px; ここを削除する */
}

.headtop {
    width: 960px;
    /* height: 123px; ここを削除する */
    background: url(www.rakuten.co.jp/) right top no-repeat;
}


> ・以前、動画で紹介されていたショップのように(画像添付あり)
> 　アイテム画像を並べてみましたがタグが不安です。

頂いたタグで、お間違いございませんが、

で、中央揃えにするように
指定頂いているので


と


のdiv部分はなくてもよろしいかと思います。

Answer

いつもお世話になっております。
h1 {
position: relative;
top: 0;
left: 0;
width: 190px;
}

.headtop {
width: 960px;
background: url(www.rakuten.co.jp/) right top no-repeat;
}
削除した後、上記タグで解釈合ってますか？

トップページは外注作成によるタグで組まれてるため
そこに
で組んだタグを差し込んでも問題ないですか？そこが気になって・・
他バナーのようにで囲ってみましたが・・

タグで横並びにした方が良いのかな？とも思いましたが知識が無く
で横並びにしました。
問題ないようでしたらは削除します。

すみませんが確認をお願いします。

Answer

ECマスターズの伊藤です。

> h1 {
> position: relative;
> top: 0;
> left: 0;
> width: 190px;
> }
> 
> .headtop {
> width: 960px;
> background: url(www.rakuten.co.jp/) right top no-repeat;
> }
> 削除した後、上記タグで解釈合ってますか？

ご案内した内容としては
上記で問題ございませんでしたが
改めて確認をさせていただいたところ

background: url(www.rakuten.co.jp/) right top no-repeat;

の行も、意味のない記述となっておりましたので

.headtop {
width: 960px;
}

としていただきますよう、お願いいたします。


> トップページは外注作成によるタグで組まれてるため
> そこに
> で組んだタグを差し込んでも問題ないですか？そこが気になって・・
> 他バナーのようにで囲ってみましたが・・

はい、tableもdivも扱いが同じとなりますので
不要となっております。

ですが、divで囲っていても囲わなくても
タグを挿入す位置によっては
全体のレイアウトが崩れてしまう場合がございますので
挿入位置にご注意くださいませ。

Answer

お返事ありがとうございます。

＞タグを挿入す位置によっては
＞全体のレイアウトが崩れてしまう場合がございますので
＞挿入位置にご注意くださいませ。

PCで確認したところ崩れてないので大丈夫だと思います。

看板の箇所余白もなくなりました◎
ありがとうございました！