I have been struggling all week with this emailer I need to send out very soon. I need to center these product images alongside their descriptions and I cannot seem to navigate my way through this template an agency handed over.
I have tried changing display properties and adding numerous other properties and methods such as adding top padding (this works visually in the builder but upon a test it still sits stuck to the top of the table). This emailer is made entirely in HTML with inline CSS elements and there is a class denotated for these tables however I cannot find the 'global' CSS attribute for them within this HTML.
I am fairly new to all of this so sorry if the question seems vague. I have attached a screenshot of the problem.
As you can see, the product images are aligned to the top of the table and they can't move to the centre of the description no matter what I try:
.
<tr>
<td align="center" style="padding:0px 0px 50px 0px">
<table align="center" border="0" cellpadding="0" cellspacing="0" class="m-dw" dir="rtl" width="540">
<tbody>
<tr>
<th align="left" class="m-db m-dw" dir="ltr" valign="top" width="270">
<table align="center" border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody>
<tr>
<td align="center"><img align="middle" alt="" src="https://d15knpe7ll4tpk.cloudfront.net/users/assets/139/images/649_EZVIZ_Camera_Range_Launch/cc599-250.png" style="width: 250px; max-width: 258px; display: block;" width="250"></td>
</tr>
</tbody>
</table>
</th>
<th align="left" class="m-db m-dw" dir="ltr" valign="middle" width="270">
<table align="center" border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody>
<tr>
<td align="center" class="p-t20">
<table align="center" border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody>
<tr>
<td style="font-family: Helvetica, Arial, sans-serif; font-size:18px; font-weight:bold; line-height:24px; color:#004b93; text-align:left;"><strong><span style="font-size:14px;"><span style="font-family:arial,helvetica,sans-serif;">CC599<br>
EZVIZ C3W Huskey Air Wi-Fi Camera 0</span></span><span style="font-size:14px;"><span style="font-family:arial,helvetica,sans-serif;">1</span></span><span style="font-size:14px;"><span style="font-family:arial,helvetica,sans-serif;">80p 2.8mm Fixed Lens</span></span></strong></td>
</tr>
<tr>
<td style="padding:18px 0px 0px 0px; font-family: Helvetica, Arial, sans-serif; font-size:10.16px; font-weight:normal; line-height:16.9px; color:#; text-align:left;"><strong><span style="font-family:arial,helvetica,sans-serif;"><span style="font-size:13px;"><span style="color:#616262; font-weight:bold">Features:</span></span></span></strong>
<ul>
<li><span style="font-family:arial,helvetica,sans-serif;"><span style="font-size:13px;"><span style="color:#616262; font-weight:">Wi-Fi Bullet Camera</span></span>
</span>
</li>
<li><span style="font-family:arial,helvetica,sans-serif;"><span style="color:#696969;"><span style="font-size:13px;">1080p Resolution</span></span>
</span>
</li>
<li><span style="font-family:arial,helvetica,sans-serif;"><span style="color:#696969;"><span style="font-size:13px;">Stand-Alone Camera</span></span>
</span>
</li>
<li><span style="font-family:arial,helvetica,sans-serif;"><span style="color:#696969;"><span style="font-size:13px;">Two-way audio up to 5 meters</span></span>
</span>
</li>
<li><span style="font-family:arial,helvetica,sans-serif;"><span style="color:#696969;"><span style="font-size:13px;">30m IR Illumination</span></span>
</span>
</li>
<li><span style="font-family:arial,helvetica,sans-serif;"><span style="color:#696969;"><span style="font-size:13px;">2.8mm Fixed Lens</span></span>
</span>
</li>
<li><span style="font-family:arial,helvetica,sans-serif;"><span style="color:#696969;"><span style="font-size:13px;">IP66</span></span>
</span>
</li>
</ul>
<span style="font-family:arial,helvetica,sans-serif;"><span style="font-size:13px; color:#696969;">Hikvision code: CS-CV310-A0-1B2WFR (2.8mm)</span></span>
</td>
</tr>
<!-- Button:: change/replace the button URL twice -->
<tr>
<td align="left" style="padding:20px 0px 0px 0px">
<table align="left" border="0" cellpadding="0" cellspacing="0" width="115">
<tbody>
<tr>
<td align="center">
<div>
<!--[if mso]>
<v:rect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" href="#" style="height:40px;v-text-anchor:middle;width:150px;" stroke="f" fillcolor="#0a4a93"> <w:anchorlock/> <center> <![endif]--><a href="#" style="background-color:#0a4a93;color:#ffffff;display:inline-block;font-family: Helvetica, Arial, sans-serif;font-size:12.8px;font-weight:bold; letter-spacing:0.50px; text-transform:uppercase; line-height:40px;text-align:center;text-decoration:none;width:150px;-webkit-text-size-adjust:none;"
target="_blank">Order now </a>
<!--[if mso]>
</center> </v:rect> <![endif]-->
</div>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
<!-- End Button -->
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</th>
</tr>
</tbody>
</table>
</td>
</tr>