4

私はこの単純なHTML / CSSを持っています

<div class="image-group">
  <img src="http://placehold.it/80x80" />
  <img src="http://placehold.it/120x120" />
  <img src="http://placehold.it/80x80" />
</div>

.image-group img {
  margin: 0;
  padding: 0;
}

JSFiddle

画像がくっつかないのはなぜ？Chrome のインスペクターを使用して要素を検査すると、画像の間に何も表示されませんが、間隔が空いています。

負のマージンを適用することでそれらをくっつけることができますが、私によれば、とにかくくっつくはずです。

4

2 に答える 2

8

HTMLコードにスペースがあります。以下を試してください

<div class="image-group">
    <img src="http://placehold.it/80x80" /><img src="http://placehold.it/120x120" /><img src="http://placehold.it/80x80" />
</div>
于 2013-01-14T05:08:30.763 に答える
4

画像などのインライン ブロック要素が連続するスペースの処理については、こちらのブログ記事をご覧ください。

http://css-tricks.com/fighting-the-space-between-inline-block-elements/

于 2013-01-14T05:14:06.153 に答える