Results 1 to 3 of 3
Related
-
small programmes Forum: Myspace Forum
Replies: 1 -
Help with a small counter Forum: Javascript Forum
Replies: 2 -
Small tutorial Forum: Show it off!
Replies: 1 -
gaps between cells Forum: HTML Forum
Replies: 10
-
11-02-2009, 07:45 AM #1
I can't fix these gaps in a small table of images...
I have a table of images that are links that operates as my navigation for a bigger site. Here is the code for a page with just the table for the navigation. It it 1 column wide and 6 rows tall. The images change their image on mouseOver by javascript. Anyway, I can't figure out why there is a break between each img / link. All pixel dimensions have been double and triple checked.
You can see the navtest.html at www.upandawaytreehouses.com/navtest.html and the bigger site at www.upandawaytreehouses.com/index.html
Any help would be hugely appreciated!
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >
<script language="javascript" type="text/javascript" src="javascript.js"></script>
<LINK REL=stylesheet HREF="style.css" TYPE="text/css">
<title>
Up And Away Treehouses
</title>
</head>
<body>
<table border=0 cellspacing=0 cellpadding=0 width="100" height="236">
<tr><td><a href="about.html"
onMouseOver="L1HandOver();return true;"
onMouseOut="L1HandOut();return true;">
<img class="ladder" name=L1 width="100" height=37" border=0 alt="L1" src="L3.png">
</a></td></tr>
<tr><td><a href="about.html"
onMouseOver="L2HandOver();return true;"
onMouseOut="L2HandOut();return true;">
<img class="ladder" name=L2 width="100" height="42" border=0 alt="L2" src="L3.png">
</a></td></tr>
<tr><td><a href="about.html"
onMouseOver="L3HandOver();return true;"
onMouseOut="L3HandOut();return true;">
<img class="ladder" name=L3 width="100" height="39" border=0 alt="L3" src="L3.png">
</a></td></tr>
<tr><td><a href="about.html"
onMouseOver="L4HandOver();return true;"
onMouseOut="L4HandOut();return true;">
<img class="ladder" name=L4 width="100" height="38" border=0 alt="L4" src="L4.png">
</a></td></tr>
<tr><td><a href="about.html"
onMouseOver="L5HandOver();return true;"
onMouseOut="L5HandOut();return true;">
<img class="ladder" name=L5 width="100" height="40" border=0 alt="L5" src="L5.png">
</a></td></tr>
<tr><td><a href="about.html"
onMouseOver="L6HandOver();return true;"
onMouseOut="L6HandOut();return true;">
<img class="ladder" name=L6 width="100" height="40" border=0 alt="L6" src="L6.png">
</a></td></tr></table>
</body>
</html>
-
11-02-2009, 04:19 PM #2
Re: I can't fix these gaps in a small table of images...
I just fixed it myself!
It all has to do with the spaces inbetween the <td> and </td>. There must be none. I don't understand this at all as I have been told, browsers ignore spaces in html code. All the same, once I took out the spaces, it worked. Like this:
<tr><td><a href="about.html"
onMouseOver="L1HandOver();return true;"
onMouseOut="L1HandOut();return true;">
<img class="ladder" name=L1 width="100" height=37" border=0 alt="L1" src="L1.png"></a></td></tr>
Instead of this:
<tr><td><a href="about.html"
onMouseOver="L1HandOver();return true;"
onMouseOut="L1HandOut();return true;">
<img class="ladder" name=L1 width="100" height=37" border=0 alt="L1" src="L1.png"> </a></td></tr>
-
11-04-2009, 10:04 AM #3
Re: I can't fix these gaps in a small table of images...
Cloudjiffy- PaaS for Developers
10-05-2020, 12:30 AM in Web Hosting Forum