Mouse handler inserts gap below image? 2

[Alt255]

This isn't exactly my cup of tea but my boses have decided that I'm suited for the work.

I have a navigation bar with a series of images stacked in the cells of a table. Onmouseover and onmouseout swaps images. I keep ending up with a gap between the images in two of the cells.

This is all I'm doing:

<a href="about_us.htm">
<img border="0" onmouseover="document.contactButton.src='imgs/e_contact_u.gif'" onclick="document.contactButton.src='imgs/e_contact_d.gif'" onmouseout="document.contactButton.src='imgs/e_contact.gif'" src="imgs/e_contact.gif" name="contactButton" width="165" height="90">

Would one of you gurus take a look at

http://www.thedarcygroup.com/xindex.htm

and let me know what I'm doing wrong?

It's probably something incredibly simple. Thanks in advance.


Add water (makes its own sauce).

 

[BillyRayPreachersSon]

You've a load of whitespace. Try removing it all and see if that helps.

Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

 

[Alt255]

Thanks for the fast reply! I removed most of the whitespace (leaving a bit for legibility) and I get the same gap after the image.

Note that I have already recreated the tables from scratch, checked the images, regenerated the images, resized the images and anything else I could think of to try... but the result has always been the same. When I remove the onmouse...etc, the mis-aligned image slides neatly into place.

Any thoughts?

Add water (makes its own sauce).

 

[Vragabond]

Changing this:

<td width="165" height="90" valign="bottom">
<a href="about_us.htm">
<img border="0" onmouseover="document.contactButton.src='imgs/e_contact_u.gif'" onclick="document.contactButton.src='imgs/e_contact_d.gif'" onmouseout="document.contactButton.src='imgs/e_contact.gif'" src="imgs/e_contact.gif" name="contactButton" width="165" height="90">
</a>
   </td>

to a version without whitespace (like Dan suggested)

<td width="165" height="90" valign="bottom"><a href="about_us.htm"><img border="0" onmouseover="document.contactButton.src='imgs/e_contact_u.gif'" onclick="document.contactButton.src='imgs/e_contact_d.gif'" onmouseout="document.contactButton.src='imgs/e_contact.gif'" src="imgs/e_contact.gif" name="contactButton" width="165" height="90"></a></td>

makes it work in my Mozilla.

 

[Alt255]

Sorry I misunderstood about the whitespace. Simple things baffle me.

Here's a star for both of you for the quick replies and the professional help.


Add water (makes its own sauce).