Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

HTML

Posted by Todd Blackmon
Todd Blackmon
Courses Plus Student 922 Points

Trying to wrap a cell as a link and it's not functional in outlook.

Below is my code and what I am trying to attempt will not render and work in outlook, does anyone have a work around? I know outlook is super finicky but, I don't want to use an image. Please help! 

<table align="left" border="0" cellpadding="0" cellspacing="0" class=
"fullCenter" width="175">
    <tbody>
        <tr>
            <td width="100%">
                <!-- Small Img 2 -->
                <a href="[mylinkhere]">
                <table align="center" border="0" cellpadding="0" cellspacing=
                "0" class="imgFull" style=
                "border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"
                width="175">
                    <tbody>
                        <tr>
                            <td height="37" style=
                            "background-color: #1EADED; color: #FFFFFF; font-family: Arial; font-size: 14px; font-weight: bold; margin-right: auto; margin-top: auto; text-align: center; text-decoration: none; vertical-align: middle"
                            width="100%">Use Your Insurance</td>
                        </tr>
                    </tbody>
                </table></a>
            </td>
        </tr>

        <tr>
            <td style=
            "font-size: 14px; color: #363636; font-weight: normal; text-align: center; font-family: 'proxima_nova_rgregular', Helvetica, Arial, sans-serif; line-height: 24px; vertical-align: top;"
            width="100%">BodylogicMD's staff will submit your out of network
            claims to your provider for reimbursement to increase likelihood of
            payment.</td>
        </tr>
    </tbody>
</table>
Todd Blackmon
Todd Blackmon
Courses Plus Student 922 Points

<table class="fullCenter" align="left" border="0" cellpadding="0" cellspacing="0" width="175"> <tbody> <tr> <td width="100%"> <!-- Small Img 2 --> <a href="[mylinkhere]"><table style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;" class="imgFull" align="center" border="0" cellpadding="0" cellspacing="0" width="175"> <tbody> <tr> <td style="margin-top: auto; margin-right: auto;font-family: Arial; font-size: 14px; font-weight: bold; text-align: center; vertical-align:middle; color: #FFFFFF; text-decoration: none;" bgcolor="#1EADED" height="37" width="100%">Use Your Insurance</td> </tr> </tbody> </table></a> </td> </tr> <tr> <td style="font-size: 14px; color: #363636; font-weight: normal; text-align: center; font-family: 'proxima_nova_rgregular', Helvetica, Arial, sans-serif; line-height: 24px; vertical-align: top;" width="100%">BodylogicMD's staff will submit your out of network claims to your provider for reimbursement to increase likelihood of payment. </td> </tr> </tbody> </table>

1 Answer

Veerle Deschepper
Veerle Deschepper
2,623 Points
Veerle Deschepper
Veerle Deschepper
2,623 Points

Table inside an Anchor is not allowed; and will not work. especially not in e-mail clients who only support a fraction of the stuff browsers do - and they are not so forgiving as well ..

                <table align="center" border="0" cellpadding="0" cellspacing=
                "0" class="imgFull" style=
                "border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"
                width="175">
                    <tbody>
                        <tr>
                            <td height="37" style=
                            "background-color: #1EADED; color: #FFFFFF; font-family: Arial; font-size: 14px; font-weight: bold; margin-right: auto; margin-top: auto; text-align: center; text-decoration: none; vertical-align: middle"
                            width="100%"><a href="[mylinkhere]">Use Your Insurance</a></td>
                        </tr>
                    </tbody>
                </table>

I am not rendering this code; but you have to make the anchor tag as big as the cell it is in. Actually looking at your code again I see no reason to use a table here? just style a div like you want and put the anchor inside that. Why did you do this markup in a table? (the surrounding table is ok; it's the only way to make up html e-mail letters work)