Изображение поверх изображения для электронной почты

Question

Есть ли возможность разместить изображение (например, кнопку воспроизведения) поверх изображения для электронного письма? Я только что создал раздел с фоновым изображением и поместил поверх него другое изображение.

В настоящее время я сделал это, оно работает для macOs и многих клиентов, но не работает для всех клиентов, таких как Outlook:

      <style type="text/css">
  .ReadMsgBody {
    width: 100%;
    background-color: #f6f6f6;
  }
  .ExternalClass {
    width: 100%;
    background-color: #f6f6f6;
  }
  body {
    width: 100%;
    background-color: #f6f6f6;
    margin: 0;
    padding: 0;
    -webkit-font-smoothing: antialiased;
    font-family: Arial, Times, serif }
  table {
    border-collapse: collapse !important;
    mso-table-lspace: 0pt;
    mso-table-rspace: 0pt;
  }
  @-ms-viewport{
    width: device-width;
  }
  @media only screen and (max-width: 480px) {
    body[yahoo] .deviceWidthPadding {
      width: 320px !important;
      padding: 0 !important;
    }
    body[yahoo] .deviceWidth {
      width: 300px !important;
      padding: 0 !important;
    }
  }
</style>
<!-- Start Background Image Table -->
<table align="center" border="0" cellpadding="0" cellspacing="0" class="deviceWidthPadding" width="100%">
  <tr>
    <td align="center" background="background-image" height="414" style="background-image: url('background-image'); background-position:right; background-repeat:no-repeat !important; background-size:cover !important; width:100%; position: relative;">
      <!--[if gte mso 9]>
<v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="width:600px">
<v:fill type="frame" src="background-image" color="#ffffff" />
<v:textbox style="mso-fit-shape-to-text:true" inset="0,0,0,0">
<div style="font-size:1px;line-height:1px">
<table width="600" cellspacing="0" cellpadding="0" border="0" align="center">
<tr>
<td height="414" align="center">
<![endif]-->
      <!--[if gte mso 9]>
</td>
</tr>
</table>
</div>
</v:textbox>
</v:rect>
<![endif]-->
    </td>
  </tr>
</table>
<table border="0" bottom="0" cellpadding="0" cellspacing="0" style="bottom:0px;position:absolute; " width="600">
  <tr>
    <td style="text-align:right; align:right;position:relative; ">
      <img alt="PLAY" height="71" href="test" src="BUTTON-URL" style="height: 71px; text-align: center; margin-right: 5px; width: 71px; max-width: 71px; margin-left: 5px; margin-right:5px;margin-bottom:15px; padding: 0px;   bottom:0px; position:relative;" width="71">
    </td>
  </tr>
</table>
<!-- End Background Image Table -->