Vertical align is not working in plain text? - html

Question

The below code is working fine except the past is not working as expected in plain text. I'm trying to add vertical-align:top in Email part (last column in the code) but it is not working.. I need help. kindly find below code and let me know what to do!
Code:
<table style="width:330px;">
<tbody>
<tr>
<td
style="text-align: center;font-size:8pt;border-right:2px solid rgb(211,211,211);"
>
<img
height="15"
src="/SigEditorHelper/GetEImage?ImgName=LocationPin_Icon.png"
width="15"
/><br />
<span style="font-size:8pt;"
>P.O.Box 31279<br />
Jeddah,21497<br />
Saudi Arabia</span
>
</td>
<td
style="text-align: center;font-size:8pt; width:100px;border-right:2px solid rgb(211,211,211);"
>
<span style="font-size:8pt;"
><img
height="15"
src="/SigEditorHelper/GetEImage?ImgName=Phone_Icon.png"
width="15"
/><br />
M (!Mobile!)<br />
T (!Phone!)</span
>
</td>
<td style="text-align: center;font-size:9pt; ">
<img
height="15"
src="/SigEditorHelper/GetEImage?ImgName=email_icon.JPG"
width="15"
/><br />
(!Email!)<br />
</td>
</tr>
</tbody>
</table>

Answer 1

It doesn't appear that you have vertical-align: top; anywhere in your code. If you want it just for the email column, you can do inline styles for that td element.
<td style="vertical-align: top;">....
If you want them all to have it, simply use CSS for all td elements.
td {
vertical-align: top;
}
td {
vertical-align: top;
}
<table style="width:330px;">
<tbody>
<tr>
<td style="width:165px;">
<img src="/SigEditorHelper/GetEImage?ImgName=100.jpg" />
</td>
<td style="width:165px; text-align: center;">
<span style="font-weight:bold; font-size:14pt;">(!DisplayName!)</span
><br />
<span style="color:gray;font-size:12pt;">(!Position!)</span>
</td>
</tr>
<tr>
<td
colspan="2"
style="font-size:10pt;color:black;border-bottom:2px solid rgb(211,211,211);width:330px;"
>
Naseej International Trading Company (NITC).<br />
Saudi Listed Entity,TASI:1213
</td>
</tr>
<tr></tr>
</tbody>
</table>
<table style="width:330px;">
<tbody>
<tr>
<td
style="text-align: center;font-size:8pt;border-right:2px solid rgb(211,211,211);"
>
<img
height="15"
src="/SigEditorHelper/GetEImage?ImgName=LocationPin_Icon.png"
width="15"
/><br />
<span style="font-size:8pt;"
>P.O.Box 31279<br />
Jeddah,21497<br />
Saudi Arabia</span
>
</td>
<td
style="text-align: center;font-size:8pt; width:100px;border-right:2px solid rgb(211,211,211);"
>
<span style="font-size:8pt;"
><img
height="15"
src="/SigEditorHelper/GetEImage?ImgName=Phone_Icon.png"
width="15"
/><br />
M (!Mobile!)<br />
T (!Phone!)</span
>
</td>
<td style="text-align: center;font-size:9pt; ">
<img
height="15"
src="/SigEditorHelper/GetEImage?ImgName=email_icon.JPG"
width="15px"
/><br />
(!Email!)<br />
WWW.Nassejco.com
</td>
</tr>
</tbody>
</table>

Answer 2

<td style="text-align: center;font-size:9pt; line-height: 0; vertical-align:top;">
<img
height="15"
src="/SigEditorHelper/GetEImage?ImgName=email_icon.JPG"
width="15"
/><br />
(!Email!)<br />
</td>
Try this