2010-12-03 16 views
0

相続人は私の問題+コード以外の画像を持っています。私はこれを行う必要があることを指定した場所を見つけることができませんか?HTML/CSS:あなたは私はしたくない画像間で、それの下にスペースがある見ることができる場合 <a href="http://jsbin.com/oyusa3/edit" rel="nofollow">http://jsbin.com/oyusa3/edit</a></p> <p>:お互い

どうすればこの問題を解決できますか?そして、もし私が幅を指定したとしても、ボックスはちょうど完全に大きな幅になります。(ボーダーを参照してください)

答えて

2

<img>は、テキストのようにインライン要素なので、空白があると常に空白があります。画像間の白い空白を削除してみると、空白がなくなります。

はこちらをご覧ください:

ほとんどのもののCSSと同じように、この周りを行く多くの方法があります。 floatまたはdisplay: block(インラインでないようにする)またはletter-spacingを削除する方法を示すその他の回答を参照してください。

0

すべての画像の余白とパディングを設定してください。

+0

IEでこれを試してみました。それは_was_IEISしかし、;-) – Bojangles

+0

ああ、はい、マージン:0と浮動小数点:左はFFでうまく、それもIEでうまくいくはずですか?それはIEの非常に基本的なCSS – Olical

+0

です:私はマージンをしました:0px;パディング:0px。フロート:左。うまくいった:) – Mauro

0

画像タグの間のギャップを削除します。インラインになって、それはそれたくさん作るようにコードにコメントとしても

<img style="width: 48px; height: 60px; margin: 0px;" src="http://www.americaabroadmedia.org/uploads/assets/images/BIO_Frank_122x160_2dLDn73C.jpg" url="profil.php?id=103" title="Meg Meg"><img style="width: 48px; height: 60px; margin: 0px;" src="http://www.americaabroadmedia.org/uploads/assets/images/BIO_Frank_122x160_2dLDn73C.jpg" url="profil.php?id=3" title="Ani Paltian"><img style="width: 48px; height: 60px; margin: 0px;" src="http://www.americaabroadmedia.org/uploads/assets/images/BIO_Frank_122x160_2dLDn73C.jpg" url="profil.php?id=104" title="Rafo Oganesian"><img style="width: 48px; height: 60px; margin: 0px;" src="http://www.americaabroadmedia.org/uploads/assets/images/BIO_Frank_122x160_2dLDn73C.jpg" url="profil.php?id=86" title="Megan Fox"><img style="width: 48px; height: 60px; margin: 0px;" src="http://www.americaabroadmedia.org/uploads/assets/images/BIO_Frank_122x160_2dLDn73C.jpg" url="profil.php?id=92" title="Peter Pede"> 

を、スタイルシートであなたのCSSをモジュール化するためにはるかに優れています維持しやすい

1

これは、改行がインライン要素間にあるときにスペースとしてレンダリングされるためです。ソースコードの改行を削除するか、font-sizeletter-spacingを減らしてください。 imgため起きている

.items { font-size: 0px; letter-spacing: -2px; } 
1

はインライン要素である - つまり、基本的にテキストの流れの一部であるものとなります。マークアップにはスペースがあるため、出力にスペース文字があります。

これを削除するには、マークアップに空白文字を削除するか、これらの線に沿ったスタイルを使用するためにそれらを変更することができ、次のいずれか

img { 
    display: block; /* no longer an inline element */ 
    float: left;  /* element will contract width to as small as it needs to be */ 
        /* and push it left */ 
} 

これは、もはやしかし入った容器の面であなたにいくつかの問題が発生することがあります。下に押し込む、または容器を浮かせるには、別の要素clear: left(またはboth)を使用することもできます。それはあなたの全体的なレイアウトに左右されます。

関連する問題

 関連する問題