HTML Email template - mso conditional statement - html

Question

I'm working with an HTML email template for a project. Everything works great on Gmail, Yahoo, and Outlook web email client, except for the Outlook desktop app v16.0, which I have a spacing rendering issue. I used mso conditional statement to target this specific version. But it doesn't seem to work the margin-bottom that I added in and wrapped in mso statement didn't acknowledge. Any idea how to fix this?.
Email rendered in Gmail and Outlook
Here is my code:
<tr style="border-collapse:collapse">
<td align="left" style="Margin:0;padding-bottom:0px;padding-left:0px;padding-right:20px;padding-top:25px;">
<table cellpadding="10" cellspacing="0" style="border-collapse:collapse;border-spacing:0px;font-weight: 400 !important;" width="100%">
<tbody>
<tr style="border-collapse:collapse">
<td align="center" style="padding:0;Margin:0;width:560px" valign="top">
<table cellpadding="0" cellspacing="0" role="presentation" style="border-collapse:collapse;border-spacing:0px;font-weight:400 !important;" width="100%">
<tbody>
<tr style="border-collapse:collapse">
<!-- ADDED MSO CONDITIONAL STATEMENT FOR OUTLOOK ONLY-->
<!--[if gte mso 9]>
<td align="left" style="padding:0;Margin:0;Margin-bottom:8px;">
<![endif]-->
<!-- END -->
<td align="left" style="padding:0;Margin:0;">
<p style="Margin:0;font-size:14px;font-weight:400 !important;font-family:arial, 'helvetica neue', helvetica, sans-serif;line-height:21px;color:#333;">You’re just one step away from being</p>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>

Answer 1

Your html is not valid with two after eachother on outlook. And as #jmona789 says, a td you make it on the side not above. Maybe this would work better with a new
<tr style="border-collapse:collapse">
<td align="left" style="Margin:0;padding-bottom:0px;padding-left:0px;padding-right:20px;padding-top:25px;">
<table cellpadding="10" cellspacing="0"
style="border-collapse:collapse;border-spacing:0px;font-weight: 400 !important;" width="100%">
<tbody>
<tr style="border-collapse:collapse">
<td align="center" style="padding:0;Margin:0;width:560px" valign="top">
<table cellpadding="0" cellspacing="0" role="presentation"
style="border-collapse:collapse;border-spacing:0px;font-weight:400 !important;"
width="100%">
<tbody>
<!-- ADDED MSO CONDITIONAL STATEMENT FOR OUTLOOK ONLY-->
<!--[if gte mso 9]>
<tr style="border-collapse:collapse">
<td height="8" style="height: 8px; font-size: 0px; line-height:0px">
</td>
</tr>
<![endif]-->
<!-- END -->
<tr style="border-collapse:collapse">
<td align="left" style="padding:0;Margin:0;">
<p
style="Margin:0;font-size:14px;font-weight:400 !important;font-family:arial, 'helvetica neue', helvetica, sans-serif;line-height:21px;color:#333;">
You’re just one step away from being</p>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>

Answer 2

You have done some typo here, You have made first letter capital of margin property, which is setting paragraph margin to 0. Make this margin property all lowercase. See typo error in code below:
<p style="Margin:0;font-size:14px;font-weight:400 !important;font-family:arial, 'helvetica neue', helvetica, sans-serif;line-height:21px;color:#333;">You’re just one step away from being</p>
Replace all Margin to lowercase margin to fix this issue.