html - 电子邮件中的表 colspan

Question

我正在尝试使用 colspan 使图像与表格中的右侧对齐，并使带有文本的行在左侧对齐。当图像在左侧时，此方法通常有效，但现在我希望它在右侧，但它不起作用。请记住这是针对 outlook 电子邮件的，因此您不能使用 float 、align="right"等。

这是我的代码:

<table cellpadding="0" cellspacing="0" width="600" style="width: 100%; max-width: 600px;">
    <tr>
        <td align="center">
            <table cellpadding="0" cellspacing="0" width="580" style="border: 1px solid;">
                <tr>
                    <td style="font-size: 10px;">sdfsdfsdfsdfdsdfhhhhhhhhlklkjlkj</td>
                  <td></td>
                </tr>

                <tr>
                    <td>sdfsdf</td>
                </tr>

                <tr>
                    <td rowspan="3" ><img src="https://gallery.mailchimp.com/b083c967cd22e35ab4ce75e7a/images/e3c991a6-22c4-4ee2-a08d-7d23e30f8c29.png" alt="" width="400"></td>
                </tr>
            </table>
        </td>
    </tr>
</table>

https://jsfiddle.net/yk3fanoq/1/

Answer 1

你需要把文字和图片分两列(td)

<table cellpadding="0" cellspacing="0" width="600" style="width: 100%; max-width: 600px;">
  <tr>
    <td align="center">
      <tr>
        <td align="left">
          sdfsdfsdfsdfdsdfhhhhhhhhlklk
          sdfsdf
        </td>  
        <td rowspan="3" align="right">
          <img src="https://gallery.mailchimp.com/b083c967cd22e35ab4ce75e7a/images/e3c991a6-22c4-4ee2-a08d-7d23e30f8c29.png" alt="" width="400">
        </td>
      </tr>
    </td>
  </tr>
</table>