I've been working on creating an email newsletter template using SendGrid, and I've run into a formatting issue where the content doesn't align properly in the email body. The image below shows how it's appearing incorrectly. Does anyone have tips on centering the content within the newsletter?
Edit 1: The problem seems to be specific to Outlook
<style type="text/css">
body {
min-width: 100%;
margin: 0;
padding: 0;
-webkit-font-smoothing: antialiased;
font-family: Trebuchet MS;
}
span {
color:#808080;
font-size:12px;
}
img {
display: inline-block;
max-width: 100%;
max-height: 100%;
}
table {
border-collapse: collapse;
}
</style>
<!--Main Container-->
<table border="" cellpadding="0" cellspacing="0" width="100%" class="wrapper">
<tbody>
<tr>
<td valign="top" width="600">
<!--First Table-->
<table border="0" cellpadding="0" cellspacing="0" class="devicewidth">
<tbody>
<tr>
<td valign="top">
<!--Content-->
</td>
<td valign="top">
<!--Content-->
</td>
<td valign="top">
<!--Content-->
</td>
<td valign="top">
<!--Content-->
</td>
<td valign="top">
<!--Content-->
</td>
<td valign="top">
<!--Content-->
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
<!--End of Main Container-->