クリッカブルマップで画像と画像の間に隙間が出来てしまう

質問

現在、ホームページを作ってみようと思い作成しているのですが、クリッカブルマップを使い、画像の特定の場所からリンクをさせようと思っているのですが、
クリッカブルマップを使っている画像Aと同じくクリッカブルマップを使っている画像Bを上下に隙間なく並べようとすると数pxほど隙間が開いてしまいます。
単なる画像データを上下に並べた時にはぴったりとくっついていたので、マージンやパディングの設定がおかしい訳ではないだろうと思っているのですが、これはクリッカブルマップを追加した事によって何か追加でスタイルシートを設定してあげなければいけないのでしょうか？
それとも、クリッカブルマップを使った時はどうしても隙間を埋める事ができないのでしょうか？
1つの画像でやればいいのですが、HPのデザイン上・管理上の都合(画像データの差し替え頻度)どうしても分けて使いたいと思っています。

ご回答お願いします。

該当部分のHTMLソースです。

<img src="top.jpg" alt="ようこそ" usemap="#map1" width="600" height="200" />
<map name="map1">
<area shape="rect" coords="0,0,200,200" href="auto.html" />
</map>
<img src="top.jpg" alt="ようこそ" usemap="#map2" width="600" height="200" />
<map name="map2">
<area shape="rect" coords="400,0,600,200" href="auto.html" />
</map>

回答No.2

myeyesonly · ベストアンサー

こんにちは。
確かこれは、img タグの前後の改行がキャラクターとして処理されてしまうというバグによる現象だったと記憶します。

よって、前の方の方法の他に、

<img src="top.jpg" alt="ようこそ" usemap="#map1" width="600" height="200" /><!--
--><map name="map1">

img タグと次のタグの間の改行をコメントしてしまう方法、

や

<img src="top.jpg" alt="ようこそ" usemap="#map1" width="600" height="200" /><map name="map1">

imgタグの前後に改行を入れない方法。

などでいけたと思います。

お礼

回答ありがとうございます。
改行せずに続けて書いた所、無事に隙間なく画像が表示されました。

imgタグの前後の改行がキャラクターとして処理されてしまうバグなんていうのがあったのですね・・・。
今後HPを作るときの参考にさせていただきます。

回答No.1

noname#20964

これではダメですか？
<img src="top.jpg" alt="ようこそ" usemap="#map1" width="600" height="200" /><img src="top.jpg" alt="ようこそ" usemap="#map2" width="600" height="200" />
<map name="map1">
<area shape="rect" coords="0,0,200,200" href="auto.html" />
</map>
<map name="map2">
<area shape="rect" coords="400,0,600,200" href="auto.html" />
</map>
テーブルに入れても隙間がなくなったと思います。（記憶が曖昧です）

お礼

回答ありがとうございます。
この方法では隙間が残ってしまいましたが、クリッカブルマップの書き方としてこのように書いても大丈夫なのですね。
HTMLの書き方として参考になりました。