Solved

problem with white space outside imagemap

Posted on 2001-06-13
7
157 Views
Last Modified: 2012-05-07
I have been using a fairly standard imagemap inside a table cell (though I noticed this effect is apparent outside a table) of the form
<img src='' border=0 usemap='#a'>
<map name=a>
<area etc..
</map>

The map works fine with links etc but there is a white space horisontal line under the map (a few pixels wide) so that I cannot place my image map diectly above another image without a space.  I have tried varying the border=0 position in the tag.  any ideas?
0
Comment
Question by:sej_goff
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 3
  • 3
7 Comments
 
LVL 15

Expert Comment

by:a.marsh
ID: 6188158
Any chance of seeing the whole code?

Ant
0
 
LVL 22

Accepted Solution

by:
CJ_S earned 50 total points
ID: 6188161
Place the map right after the img
<img src='' border=0 usemap='#a'><map name=a>
<area etc..
</map>
0
 

Author Comment

by:sej_goff
ID: 6188259

Tried putting the map right after the img tag.  Didn't seem to work.

This is not quite the html but it does exemplify the problem.  why the gap between the top left image map and the yellow backgrounded text?

<TABLE width=759 height=180 BORDER=0 CELLPADDING=0 CELLSPACING=0>

<TR>
<TD><IMG SRC="../images/topleftbwr.gif" USEMAP="#topleftbwr" WIDTH=350 height=161 BORDER="0">
<MAP NAME="topleftbwr">
<AREA SHAPE="RECT" HREF="http://www.coke.com/gateway.html" COORDS="205,37, 215,52"></MAP>

<TD valign=top height=131><IMG SRC="../images/toprightr.gif" width=409 border=0></TD>
</TR>
     
<TR height=19>
<TD bgcolor=yellow>text</TD>
</TR>
     
</table>

0
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
LVL 15

Expert Comment

by:a.marsh
ID: 6188276
That isn't a complete table....is your page on the Web?

Ant
0
 
LVL 15

Expert Comment

by:a.marsh
ID: 6188293
Is this what you want?

<html>
<head>
</head>
<body>
<MAP NAME="topleftbwr">
<AREA SHAPE="RECT" HREF="http://www.coke.com/gateway.html" COORDS="205,37, 215,52">
</MAP>
<TABLE width=759 height=180 BORDER=0 CELLPADDING=0 CELLSPACING=0>
<TR>
<TD><IMG SRC="../images/topleftbwr.gif" USEMAP="#topleftbwr" WIDTH=350 height=161 BORDER="0"></TD>
<TD valign=top height=131><IMG SRC="../images/toprightr.gif" width=409 border=0></TD>
</TR>
<TR height=19>
<TD>&nbsp;</TD>
<TD bgcolor=yellow>text</TD>
</TR>
</TABLE>
</body>
</html>

Ant
0
 

Author Comment

by:sej_goff
ID: 6188320

Tried putting the map right after the img tag.  Didn't seem to work.

This is not quite the html but it does exemplify the problem.  why the gap between the top left image map and the yellow backgrounded text?

<TABLE width=759 height=180 BORDER=0 CELLPADDING=0 CELLSPACING=0>

<TR>
<TD><IMG SRC="../images/topleftbwr.gif" USEMAP="#topleftbwr" WIDTH=350 height=161 BORDER="0">
<MAP NAME="topleftbwr">
<AREA SHAPE="RECT" HREF="http://www.coke.com/gateway.html" COORDS="205,37, 215,52"></MAP>

<TD valign=top height=131><IMG SRC="../images/toprightr.gif" width=409 border=0></TD>
</TR>
     
<TR height=19>
<TD bgcolor=yellow>text</TD>
</TR>
     
</table>

0
 

Author Comment

by:sej_goff
ID: 6188357
You were right.  If all the map tags were on one line then it works.
As you noticed (Ant) the text I was playing with on this computer was missing an end tag which didn't help.

thank you all for your help.
0

Featured Post

Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Use these top 10 tips to master the art of email signature design. Create an email signature design that will easily wow recipients, promote your brand and highlight your professionalism.
Find out what you should include to make the best professional email signature for your organization.
In this tutorial viewers will learn how add a scalable full-width header using CSS3. Create a new HTML document with an internal stylesheet. Set a tiled background.:  Create a new div and name it Header. Position it with position:absolute at the top…
The viewer will the learn the benefit of plain text editors and code an HTML5 based template for use in further tutorials.

710 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question