Anchor around table - NOT working in outlook

Question

I'm developing a newsletter for Mailchimp with below HTML structure for one of the block -

<table border="0" cellpadding="0" cellspacing="0" width="100%" align="center"> 
<tr> 
    <td valign="top" class="complete-block">
        <a href="#" target="_blank">
            <table border="0" cellpadding="9" width="100%" align="center" cellspacing="0" class="templateButton display-inline" mc:hideable> 
                <tr> 
                    <td align="center"  valign="middle" class="templateButtonContent"> Amazon </td> 
                </tr> 
            </table>
        </a> 
        <a href="#" target="_blank">
            <table border="0" cellpadding="9" width="100%" align="center" cellspacing="0" class="templateButton display-inline" mc:hideable> 
                <tr> 
                    <td  align="center" valign="middle" class="templateButtonContent"> Apple iBooks </td> 
                </tr> 
            </table>
        </a> 
        <a href="#" target="_blank">
            <table border="0" cellpadding="9" width="100%" align="center" cellspacing="0" class="templateButton display-inline" mc:hideable> 
                <tr> 
                    <td align="center" valign="middle"  class="templateButtonContent"> Nook </td> 
                </tr> 
            </table>
        </a>
        <a href="#" target="_blank">
            <table border="0" cellpadding="9" width="100%" align="center" cellspacing="0" class="templateButton display-inline" mc:hideable> 
                <tr> 
                    <td align="center"  valign="middle" class="templateButtonContent"> Google </td> 
                </tr> 
            </table>
        </a>
        <a href="#" target="_blank">
            <table border="0" cellpadding="9" width="100%" align="center" cellspacing="0" class="templateButton display-inline" mc:hideable> 
                <tr> 
                    <td align="center" valign="middle"  class="templateButtonContent"> Kobo </td> 
                </tr> 
            </table>
        </a>
        <a href="#" target="_blank">
            <table border="0" cellpadding="9" width="100%" align="center" cellspacing="0" class="templateButton display-inline" mc:hideable> 
                <tr> 
                    <td align="center" valign="middle"  class="templateButtonContent"> Sony </td> 
                </tr> 
            </table>
        </a> 
    </td>
</tr>

The problem is that when I tested the template on Outlook, I found that my buttons [Amazon, google, nook etc] don't have LINK.

What am I missing? Can't we wrap a table in anchor tag?

Related post http://stackoverflow.com/questions/9754881/how-to-wrap-a-table-in-a-link — mike, Mar 19 '14 at 16:20

score 10 · Answer 1 · edited Mar 17 '14 at 09:50

10

HTML emails still lack the features that browsers makeup for on websites, it's like developer in HTML for IE 5. The anchor tag will not work around tables and sometimes will not even work around divs, however obviously webpages do not have these problems. This is due to the standards not really being recognised by mail clients as they are in browsers.

Try wrapping the content in the cells in just the anchor tag, around your button:

<table border="0" cellpadding="9" width="100%" align="center" cellspacing="0" class="templateButton displayinline" mc:hideable>
    <tr>
    <td align="center" valign="middle" class="templateButtonContent">
            <a href="#" target="_blank">Sony</a>
        </td>
    </tr>
</table>

I know it's not ideal, however it is a way around this problem.

edited Mar 17 '14 at 09:50

lu-bhz

181
7

answered Mar 12 '14 at 21:57

benfes

215
1
6

This is how our legacy code works, and it works great if there's a single cell in the table. Once you get more content, though, you end up duplicating a ton of links. This is the very problem I'm trying to solve. I'm hoping there's some sort of workaround (possibly using mso tags) to prevent from having to include each link in my email several times. – Greg Jackson Mar 13 '14 at 22:13
And I just realized that I commented on this as if I asked the original question. Upvoting because it perfectly addresses the original question, but it's not sufficient to get my bounty. – Greg Jackson Mar 18 '14 at 17:24

Anchor around table - NOT working in outlook

1 Answers1

Linked