Outlook Windows not rendering correctly <tr> height, it should have the same height of the first column like in other email providers

Question

Correct rendering and code

<table cellpadding="0" cellspacing="0" width="264" border="0" style="color:#142752;font-family:Helvetica, -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, sans-serif;font-size:12px;line-height:133%;table-layout:auto;width:264px;border:none;">
 <tr style="width:264px;height:125px">
  <td style="width:125px;height:125px">
   <div style="height:125px;overflow:hidden">
    <img src="https://img3.oastatic.com/img2/49260499/max/whatsapp-image-2020-05-07-at-17.jpg"         style="height:125px;width:125px"/>
   </div>
  </td>
 <td style="background-color:red;width:139px;height:125px;padding:0px 10px 0px 10px;border:0px solid transparent;border-top-right-radius:10px;border-bottom-right-radius:10px">
  <p style="font-family:Helvetica;font-size:12px;line-height:14px;margin-bottom:-7px">Small title</p>
  <p style="font-family:Helvetica;font-size:12px;line-height:14px;padding:0px">
   <a href="https://stackoverflow.com/" target="_blank" style="font-weight:700;text-decoration:none;color:#1C3775;">OUTLOOK <br/> WINDOWS <br/> SUCKS </a></p>
 </td>
</tr>
</table>

I tried almost everything, it doesn't depend from the length of the text, the <br> or the paddings. I also tried to delete the <div> containing the image since outlook doesn't like divs

Answer 1

By default an image is an inline element. So I'm thinking that maybe it leaves space below the image for descenders of letters, like g, j, p, q.

There are 2 things you might want to try:

1. Set the image to display:block using the inline styles you are already using.
2. Add a vertical-align:bottom to the inline styles of the image.

I'm not sure if either will work in Outlook, but it's worth a shot.