Un-wanted space

liunx

Guest
I am having trouble with my menu bar images (184x20) leaving space in cell-spaced borders. Here is the html code I used :<br />
<br />
<br />
<table width="12%" border="1" cellspacing="1" cellpadding="0" height="20" bordercolor="#000000"><br />
<tr> <br />
<td valign="top" height="2"> <br />
<img src=http://www.htmlforums.com/archive/index.php/"menu_bar.jpg" width="184" height="20"><br />
</td><br />
</tr><br />
<tr> <br />
<td valign="top" height="2"><font size="2" face="Tahoma">-</font><b><font size="2" face="Tahoma"><br />
<A HREF=http://www.htmlforums.com/archive/index.php/"/index.html#ANP">Home</A><br><br />
</font><b> </b><font size="2" face="Tahoma">-</font><b><font size="2" face="Tahoma"> <br />
Link here </font><font size="2" face="Tahoma"><br><br />
-</font><b><font size="2" face="Tahoma"> <br />
Link here <br><br />
-</font><b><font size="2" face="Tahoma"> <br />
Link here<br><br />
</tr><br />
<tr> <br />
<br />
- Thanks<!--content--><td valign="top" height="2"> <br />
<img src=http://www.htmlforums.com/archive/index.php/"menu_bar.jpg" width="184" height="20"><br />
</td><br />
<br />
This should all be on one line, otherwise odd spaces are introduced:<br />
<br />
<td valign="top" height="2"><img src=http://www.htmlforums.com/archive/index.php/"menu_bar.jpg" width="184" height="20" alt="site menu"></td><br />
<br />
<br />
<br />
Note that you also have a closing </font> and </td> missing near the end of the code.<br />
<br />
Check the position of the <b> and </b> pairs. It is more logical if they directly enclose the word(s) they refer to, especially within a link, that is change:<br />
<b><font size="2" face="Tahoma"><A HREF=http://www.htmlforums.com/archive/index.php/"/index.html#ANP">Home</A><br></font></b><br />
<br />
to instead be:<br />
<a href=http://www.htmlforums.com/archive/index.php/"/index.html#ANP"><font size="2" face="Tahoma"><b>Home</b></font></a><br><br />
<br />
<br />
<br />
You have a lot of opening <b> tags, but the closing </b> tag is nowhere to be seen.<br />
<br />
Additionally use the <br> after all tags are closed, but before opening a new set.<br />
<br />
Layout the source code the same way for each group of code, then errors like this will jump off the page at you. Alternatively run the code through <!-- m --><a class="postlink" href="http://validator.w3.org/">http://validator.w3.org/</a><!-- m --> to find any tag spelling typos, missing attributes, and wrongly nested or unclosed tags, and other such errors.<br />
<br />
<br />
[edited for spelling]<!--content-->1) missing </td> tag near bottom of supplied code.<br />
2) height defined as "2" instead of "20" in first data cell, and as "2" in the 2nd, which really could be left blank.<br />
3) HERE YA GO: put the <img> tag directly between the <td> tags, like this:<br />
<br />
<td valign="top" height="20"><img src=http://www.htmlforums.com/archive/index.php/"menu_bar.jpg" width="184" height="20"></td><br />
<br />
putting the image on a separate line, while neat (and my own preference as well), CAN add space.<!--content-->
 
Back
Top