The little underscores to the right of linked images are caused by spaces
between the image and the anchor:

<a href="blah.html">
 <img src="blah.gif" border=0>
</a>

Will generate (on some browsers) a clickable link with a little line to
the lower right (That line is actually an underlined space that is part of
the link with the graphic)  The underscore will be displayed in whatever
color the other links on the page are displayed in.

NOTE: on some browsers, there may be an underlined space generated in
front of the image as well..

To remedy the situation, simply don't include spaces that shouldn't be there.
(a newline counts as a space in many browsers)

So, use code more like:

<a href="blah.html"><img
   src="blah.gif" border=0></a>

Note that there are no spaces or newlines between the tags.  All newlines
are inside a tag instead of between them.

This technique is useful when dealing with tables also, as well as when
trying to line images up correctly (such as with an image that has been
split into multiple sections)  IE:

<img src="blah.gif">

<table><tr>

  <td><a href="blah.html"><img
         src="thumbnail.gif"></a></td>

  <td>Paragraph text goes here.
         This product is, blah blah blah</td>

  <td>More paragraph text goes here.
         The last of the paragraph text.</td>

</tr></table>


Note that in the above example, the newlines between the table cells
will generate a space in the body (placed before the table is
displayed)  There WILL be a space there if you break apart your table
elements like that.. Such spaces can mess up formatting on lines
containing only images, especially if the line consists of only very short
images (only a small number of pixels high.. around 10 or so), so if you
don't want one, don't include newlines or spaces between your table
elements (this is a less readable, but is still functional, and you can
still include at least hints as to where the cells are:

<img src="blah.gif"><table><tr><td><a
  href="blah.html"><img
      src="thumbnail.gif"></a></td><td>Paragraph
  text goes here.
      This product is, blah blah blah</td><td>More
  paragraph text goes here.
      The last of the paragraph
text.</td></tr></table>


In other words, use spaces and newlines only where a space would already
be. (Including insides of tags)  Whatever number of spaces you include will
be generated as only one space, so don't be afraid to format your code in
an at least slightly readable manner ;)

Of course, if you are using a WYSIWYG editor, then you have little control
over how the code is generated.. you may need to go back through later and
"fix" the HTML.

Pat

HWG: hwg-graphics mailing list archives, maintained by Webmasters @ IWA