HTML email Outlook images display inline block - html

Question

I am having an issue with keeping 2 images on the header of an email as display:inline-block i need the 2 images to "touch" each other so there isn't the white gap between them like the screen shot below. It would be great it it could be 1 image but they are both linking to different urls.
Here is the code for this TD. Ohhh of course this is responsive as well :)
<td>
<!--[if (gte mso 9)|(IE)]>
<table width="258" align="left" cellpadding="0" cellspacing="0" border="0">
<tr>
<td>
<![endif]-->
<table align="left" bgcolor="#ffffff" border="0" cellpadding="0" cellspacing="0" class="content" style="width:100%;max-width:258px;">
<tr>
<td><img alt="" src="header-l.png" style="width:100%;max-width:258px;border:0;display:block;" /></td>
</tr>
</table>
<!--[if (gte mso 9)|(IE)]>
</td>
</tr>
</table>
<![endif]-->
<!--[if (gte mso 9)|(IE)]>
<table width="258" align="left" cellpadding="0" cellspacing="0" border="0">
<tr>
<td>
<![endif]-->
<table align="left" bgcolor="#ffffff" border="0" cellpadding="0" cellspacing="0" class="content" style="width:100%;max-width:258px;">
<tr>
<td><img alt="" src="header-r.png" style="width:100%;max-width:258px;border:0;display:block;" /></td>
</tr>
</table>
<!--[if (gte mso 9)|(IE)]>
</td>
</tr>
</table>
<![endif]-->
</td>
I also have these styles in the header... When i added this "mso-table-lspace:0;mso-table-rspace:0;" to the table it slimmed up the LARGE gap that was there but still have like a 2px gap between them.
.content {width: 100%; max-width: 516px;}
table {border-collapse: collapse;table-layout: fixed;margin:0 auto;mso-table-lspace:0;mso-table-rspace:0;}
table table table {table-layout: auto;}
table table {table-layout: auto;}
Willing to try any suggestions!

Answer 1

Can you test with this structure :
<table style=" margin:0;"cellpadding="0" cellspacing="0" border="0" >
<tr style=" margin:0;">
<td style="margin:0;">
<img style="margin:0; display:block;" src="img2.jpg" />
</td>
<td style="margin:0;">
<img style="margin:0; display:block;" src="img1.jpg" />
</td>
</tr>
</table>
I never test responsive with email... so i work with fix size on all of my element...

Answer 2

A working fix is to add the following style sheet to the head part of your email
<style type="text/css">
[office365] button,div {display: block !important; }
</style>
With this all newly added button/div parts from outlook online get the correct display block setting and the white spaces disappear