Simple HTML problem with href

Question

I am trying to create images hyperlinked to some URL's and hyperlinks donot seem to work.

I am using the code as given below at http://windchimes.co.in/index_w%20-%20Copy.html

Can you tell me why the hyperlinks to the icons are not workking?

<td width="29" style="padding-bottom: 42px;><a href="http://windchimes.co.in/blog" target="_blank"><img align="middle" title="blog" alt="blog" src="http://dl.dropbox.com/u/529534/windchimes/icon-blog.gif"&gt;&lt;/a&gt;&lt;/td&gt;&lt;td width="29" style="padding-bottom: 42px;> <a href="http://www.linkedin.com/groups?gid=120310" target="_blank"><img align="middle" title="linkedin" alt="linkedin" src="http://dl.dropbox.com/u/529534/windchimes/icon-linkedin.gif"&gt;&lt;/a&gt;&lt;/td&gt;&lt;td width="29" style="padding-bottom: 42px;> <a href="http://www.facebook.com/group.php?gid=72425590275" target="_blank"><img align="middle" title="facebook" alt="facebook" src="http://dl.dropbox.com/u/529534/windchimes/icon-facebook.gif"&gt;&lt;/a&gt;&lt;/td&gt;&lt;td width="29" style="padding-bottom: 42px;> <a href="http://twitter.com/windchimesindia" target="_blank"><img align="middle" title="twitter" alt="twitter" src="http://dl.dropbox.com/u/529534/windchimes/icon-twitter.gif"&gt;&lt;/a&gt;&lt;/td&gt;&lt;td width="29" style="padding-bottom: 42px;> <a href="http://www.youtube.com/user/Windchimesindia" target="_blank"><img align="middle" title="Youtube" alt="Youtube" src="http://dl.dropbox.com/u/529534/windchimes/icon-youtube.gif"&gt;&lt;/a&gt;&lt;td&gt;

Answer 1

Don't know if there is more, but you're missing the closing quotes at:

 <td width="29" style="padding-bottom: 42px;>
                                          ^^^

Answer 2

A good idea is to run your code through the W3 Validator:

http://validator.w3.org/check?uri=http://windchimes.co.in/index_w%2520-%2520Copy.html

It will tell you in what ways your HTML is malformed.

Answer 3

Your last <td> tag isn't properly closed, either.

<td width="29" style="padding-bottom: 42px;>
...
<td>

should be </td> instead of <td> at the end.

Answer 4

It is much easier to diagnose, maintain and adjust your web pages if you do the following.

1. Keep your concerns separated - your HTML should describe a document, not its style. Put your style rules into a cascading style sheet (CSS), which will also mean you'll satisfy the next rule
2. Don't repeat yourself. You had a width and style rule on all of these elements that was exactly the same. That means if you want to change the width to 30px, you'd have to find / replace each of these items (and if you automate your find and replace, you have to hope you don't accidentally replace something you didn't mean to.
3. Layout your code - by properly tabbing your HTML code, you will spot errors like missing closing tags as it will instantly look wrong to the eye.
4. Use validator.w3.org to make sure the code is correct - this will spot errors for you and will help you avoid the two problems in your code - a missing quote and a missing closing tag.

Here is a clean version of your code...

CSS:

td.myClass {
    width: 29px;
    padding-bottom: 42px;
    text-align: center;
}

And HTML:

<td style="myClass">
    <a href="http://windchimes.co.in/blog" target="_blank">
        <img title="blog" alt="blog" src="http://dl.dropbox.com/u/529534/windchimes/icon-blog.gif"&gt;
    </a>
</td>
<td style="myClass">
    <a href="http://www.linkedin.com/groups?gid=120310" target="_blank">
        <img title="linkedin" alt="linkedin" src="http://dl.dropbox.com/u/529534/windchimes/icon-linkedin.gif"&gt;
    </a>
</td>
<td style="myClass">
    <a href="http://www.facebook.com/group.php?gid=72425590275" target="_blank">
        <img title="facebook" alt="facebook" src="http://dl.dropbox.com/u/529534/windchimes/icon-facebook.gif"&gt;
    </a>
</td>
<td style="myClass">
    <a href="http://twitter.com/windchimesindia" target="_blank">
        <img title="twitter" alt="twitter" src="http://dl.dropbox.com/u/529534/windchimes/icon-twitter.gif"&gt;
    </a>
</td>
<td style="myClass">
    <a href="http://www.youtube.com/user/Windchimesindia" target="_blank">
        <img title="Youtube" alt="Youtube" src="http://dl.dropbox.com/u/529534/windchimes/icon-youtube.gif"&gt;
    </a>
</td>