M+KBOX フリー素材集

隣り合わせた画像をぴったりくっつけたいのに、なぜか隙間が空いたりすることがあって悩んだことがある人もいると思います。私もです。

 ←離れちゃってます

 ←くっついてます

【離れている画像のソース】

<img src="img/sample10.gif">
<img src="img/sample11.gif">

【離れていない画像のソース】

<img src="img/sample10.gif"><img src="img/sample11.gif">

上の2つのソース、同じ内容を改行しているかしていないかの違いだけなのですが、実はこの改行が表示の仕方を左右しているのです。

HTMLでは改行・タブ・半角スペースを連続していくつ入力しても連続した分は無視されるのですが、最初の分は1つの半角スペースとして扱われます。離れている例のソースでは2つ目のimgタグで改行したため1つの半角スペースとして扱われてしまい透き間が空いてしまった、というわけです。

隙間ができてしまったときは改行・タブ・半角スペースを間に入れないようにしてください。