- 締切済み
スタイルシート・CSSの画像の余白について
ショッピングサイトを作成しております。 楽天ショップでよくあるメイン画像を何枚か縦に並べて長いページを作成していくという作業です。 スタイルシートで作成していますが、画像を縦に並べていき、アップすると画像の下に余白ができてしまいます。 margin、paddingは0pxで指定あります。 何か原因、いい修正方法などありましたら、ぜひ教えて下さい。 よろしくお願いします。
- yu-rio
- お礼率70% (12/17)
- その他（プログラミング・開発）
- 回答数2
- ありがとう数1
- みんなの回答 （2）
- 専門家の回答
みんなの回答
- Oh-Orange
- ベストアンサー率63% (854/1345)
★回答 ・アップロードしたときの画像の下に出来る余白とはどこの事ですか？ (1)画像と『この商品は●●のため、以下の点にご注意ください。』メッセージの間。 (2)『この商品は●●のため、以下の点にご注意ください。』メッセージとその下の間。 あと『<p class="pix14">』の pox14 のスタイルシートの情報をお願いします。 お試し: ・(1)の場合は pox14 のスタイルシートで『MARGIN:0px』を追加すれば良いでしょう。 ・(2)の場合は BODY タグのスタイルシートで『MARGIN:0px』を記述すれば良いでしょう。 CSSサンプル: BODY{ MARGIN:0px; } HTMLタグの時: <BODY STYLE="MARGIN:0px"> ： </BODY> その他: ・上記のどちらの場合でも BODY タグに MARGIN:0px を指定すれば余白は出なくなります。 ・あとスタイルシートで『MARGIN』、『PADDING』の指定に単位として『px』を付けた方が 分かりやすいですよ。→『MARGIN:0px;』とか、『PADDING:0px;』とすべきです。 ・以上。参考に。
- Oh-Orange
- ベストアンサー率63% (854/1345)
★いきなり補足要求します。 ・margin、padding ともに 0px ならば、HTML ソースが原因かもしれません。 重要な部分が分かるように簡略化したソースを提示して下さい。 原因を探ってみます。
補足
ご回答ありがとうございます。 HTMLソース添付しました。いかがでしょうか・・・ （CSSも下部に添付しました。） *---------------------------------------------* <div class="ItemBox"> <p> <img src="image/●●-01.jpg" width="580" height="469"> <img src="image/●●-02.jpg" width="580" height="473"> <img src="image/●●-03.jpg" width="580" height="473"> <img src="image/●●-04.jpg" width="580" height="327"> <img src="image/●●-05.jpg" width="580" height="403"> <img src="image/●●-06.jpg" width="580" height="364"> </p> <p class="pix14"> この商品は●●のため、以下の点にご注意ください。 ●●● </p></div> *---------------------------------------------* .ItemBox{ margin:0; padding:0; width:580px; text-align:center; float:left; } *---------------------------------------------*
お礼
本当に親切にご回答ありがとうございます。 まだまだ私も勉強不足で反省しております。。。 一度試してみます。 ありがとうございましたm(_ _)m