I’m working on an html email and I was wondering how to do this one or if this is even possible in an email template considering some codes aren’t supported by some email providers and might encounter some issues when it comes to responsiveness.
I’ve managed to do everything except for the blue border like line on the left of the text.
Would appreciate any help. Thanks.
Here’s my code. I didn’t include the code for the styles as I don’t have any problems with them. Just let me know if the styles are needed too.
<tr>
<td>
<table role="presentation" class="email-container" cellspacing="0" cellpadding="0" border="0" width="600">
<tr>
<!-- Column : BEGIN -->
<td class="stack-column" valign="top" align="center">
<table role="presentation" cellspacing="0" cellpadding="0" border="0" width="270" style="margin: auto;">
<tr>
<td align="center">
<img alt="" class="fluid" src="img/some-img.png" border="0" height="" style="height: auto;">
</td>
</tr>
<tr>
<td height="10" style="font-size: 1px; line-height: 10px;"> </td>
</tr>
</table>
</td>
<!-- Column : END -->
<!-- Column : BEGIN -->
<td class="stack-column" valign="top" align="center">
<table role="presentation" cellspacing="0" cellpadding="0" border="0" width="330" style="margin: auto;">
<tr>
<td height="25" style="font-size: 1px; line-height: 25px;"> </td>
</tr>
<tr >
<td align="left">
<h1 style="font-family: 'Helvetica-Neue', sans-serif; font-weight: 700; font-size: 18px; line-height: 26px; color: #2C2C2C; padding: 0 20px; margin: 0;">Some header text</h1>
</td>
</tr>
<tr>
<td height="10" style="font-size: 1px; line-height: 10px;"> </td>
</tr>
<tr>
<td align="left" style="font-family: 'Helvetica-Neue', sans-serif; font-weight: 400; font-size: 14px; line-height: 22px; color: #606060;">
<p style="padding: 0 20px; margin: 0;">Some text some text some text some text</p>
</td>
</tr>
<tr>
<td height="5" style="font-size: 1px; line-height: 5px;"> </td>
</tr>
<tr>
<td align="left">
<a href="#" target="_blank" style="font-family: 'Helvetica-Neue', sans-serif; font-weight: 700; font-size: 14px; line-height: 22px; color: #275DAD; padding: 0 20px; margin: 0; text-decoration: none;">Some link</a>
</td>
</tr>
<tr>
<td height="10" style="font-size: 1px; line-height: 10px;"> </td>
</tr>
</table>
</td>
<!-- Column : END -->
</tr>
</table>
</td>
</tr>