I have a two part issue:

1) I need to create a horizontal line that only spans underneath part of a line of text. It looks great in all clients except for Outlook Windows, where the line disappears entirely. I first tried to use the <hr> tag, which had it's own set of complications, so instead I went with a border-bottom on a <span>. Any tips on how to make that border bottom visible?

2) The line of text above said horizontal line/border-bottom has no padding between it and an image to it's left. The padding is defined on the <img> and works great again in all clients except for Outlook Windows. Tips here?

Thank you! Code below...

<!--[if mso | IE]>
<table role="presentation" border="0" cellpadding="0" cellspacing="0">

<tr>

<td
class="" style="vertical-align:top;width:600px;"
>
<![endif]-->
<div class="mj-column-per-100 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
<table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
<tbody>
<tr>
<td style="vertical-align:top;padding-left:30px;">
<table border="0" cellpadding="0" cellspacing="0" role="presentation" style="" width="100%">
<tr>
<td align="left" style="font-size:0px;padding:0px;word-break:break-word;">
<div style="font-family:'Open Sans light', Verdana, Arial, sans-serif;font-size:18px;line-height:1;text-align:left;color:#303538;vertical-align:middle;">
<img src="https://i.ibb.co/fXbhTxK/log.png" alt="" height="70px" width="70px" style="padding-right:15px;vertical-align:middle;" />
<font style="padding:0px 0px 10px 0px;border-bottom:1px solid #ff9600;">Hello</font>World</div>
</td>
</tr>
</table>
</td>
</tr>
</tbody>
</table>
</div>