I am having HTML string, which I have to pass as mail body. HTML string having table with border 0. but for some of cells, have to show top and bottom border.
Now issue is as normal HTML it is showing border fine, below image is given
But when I add same HTML string to mail body, it is not showing borders. below image is given
Here is my HTML string :
<!DOCTYPE html>
<html>
<head></head>
<body>
<table style='width:25%;'>
<tr>
<td style='border-bottom: 1px solid black;'><b>Invoice #</b>
</td>
<td style='border-bottom: 1px solid black;text-align:center;'><b>Amount</b>
</td>
</tr>
<tr>
<td>3011-20190904-W</td>
<td style='text-align:right;'>979.71</td>
</tr>
<tr>
<td></td>
<td style='text-align:right;border-top: 1px solid black;'>979.71</td>
</tr>
</table>
</body>
</html>
Not able to track the issue. I am using sendgrid for mail sending.
Instead of:
<td style="border-bottom: 1px solid black;">
Try:
<td style="border-bottom: 1px solid #000000;">
Outlook prefers hex values instead of color names, so maybe that's the issue.
I have seen this in many mails they use <hr> tag for the border between <td> tags.
Here you need the top and bottom border for the table you can use the hr tag.
I think this will work for you.
here example for your template
<!DOCTYPE html>
<html>
<head> </head>
<body>
<table style='width:40%;'>
<tr>
<td><b>Invoice #</b></td>
<td><b>Amount</b></td>
</tr>
<tr>
<td colspan="2"><hr style="margin:0"/></td>
</tr>
<tr>
<td>3011-20190904-W</td>
<td>979.71</td>
</tr>
<tr>
<td></td>
<td><hr style="margin:0"></td>
</tr>
<tr>
<td></td>
<td>979.71</td>
</tr>
</table>
</body>
</html>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With