ベストアンサー

CSSでボックスの位置を変えたときの余白を消す

2005/01/26 23:48

CSSでボックスの位置を変えたとき、変える前にボックスがあった場所が余白になると思いますがその余白をつめる方法はないでしょうか？やはりページを１つの大きなボックスにして設定するしかないでしょうか？

tisnora
お礼率57% (47/82)

HTML
回答数2
ありがとう数0

みんなの回答 （2）
専門家の回答

質問者が選んだベストアンサー

ベストアンサー

steel_gray
ベストアンサー率66% (1052/1578)

2005/01/27 17:25 回答No.2

position:relativeでずらした時の余白でしたら、ページ全体かどうかはともかくそれが含まれる部分についてはボックスで囲う必要があるかと思います。唯一マージンでずらせば、ずれる前の領域は余白となりませんが扱いが難しく、また、MAC版IEではマージンの負数には未対応です。まだ全体像が理解できていないのですが、とりあえず・・・何パターンかサンプル書いてみたので参考になれば。（なるのかな？？） <html> <head> <title>画像を重ねるテスト</title> <style type="text/css">  </style> </head> <body> <h1>画像を重ねるテスト</h1> <dl> <dt>1.負数のマージン<samp>(margin:-xx)</samp>で重ねる（MacIEではNG）</dt> <dd> <img src="～" alt="" width="100" height="50" id="img1"><br> <img src="～" alt="" width="100" height="50" id="img2"><br> <img src="～" alt="" width="100" height="50" id="img3"> </dd> <dt>2.絶対配置<samp>(position:absolute)</samp>で重ねる</dt> <dd id="layer2"> <img src="～" alt="" width="100" height="50" id="img4"> <img src="～" alt="" width="100" height="50" id="img5"> <img src="～" alt="" width="100" height="50" id="img6"> </dd> <dt>3.相対配置<samp>(position:relative)</samp>で重ね、余分な部分は見せない<samp>(overflow:hidden)</samp></dt> <dd id="layer3"> <img src="～" alt="" width="100" height="50" id="img7"><br> <img src="～" alt="" width="100" height="50" id="img8"><br> <img src="～" alt="" width="100" height="50" id="img9"> </dd> </dl> <p>以上、3パターン</p> </body> </html>

ログインすると、全ての回答が全文表示されます。

その他の回答 (1)

steel_gray
ベストアンサー率66% (1052/1578)

2005/01/27 13:21 回答No.1

ボックスの位置を変えるといっても色々なケース、やり方がありますので、現在どのようになっていて、どの辺りが問題なのか、具体例（できれば実例）を挙げてもらえると何かアドバイスができるかもしれません。

質問者

補足 2005/01/27 14:06

具体的には　最初に画像をごく普通に数枚<img src="">で並べます　そしてそれぞれの画像に相対位置を設定して１番最初においた画像に２枚目以降の画像を重ねていきます　すると、２枚目以降の画像があった場所、相対位置を設定する前の位置（0px,0px）に余白ができます　視覚的には何もない余白です。スクロールバーして下まで見ることができますがもちろん何もない余白です　この余白はかっこ悪いので消したいわけです説明が下手だったかもしれませんがよろしくお願いします

ログインすると、全ての回答が全文表示されます。