垂直对齐在纯文本中不起作用？

Question

下面的代码运行良好，除了过去的代码在纯文本中不像预期的那样运行。 我正在尝试添加垂直-对齐:顶部在电子邮件部分（在代码的最后一列），但它是不工作的。 我需要帮助。 请找到下面的代码，让我知道怎么做！

代码:

<table style="width:330px;">
  <tbody>
    <tr>
      <td
        style="text-align:  center;font-size:8pt;border-right:2px solid rgb(211,211,211);"
      >
        <img
          height="15"
          src="/SigEditorHelper/GetEImage?ImgName=LocationPin_Icon.png"
          width="15"
        /><br />
        <span style="font-size:8pt;"
          >P.O.Box 31279<br />
          Jeddah,21497<br />
          Saudi Arabia</span
        >
      </td>
      <td
        style="text-align:  center;font-size:8pt; width:100px;border-right:2px solid rgb(211,211,211);"
      >
        <span style="font-size:8pt;"
          ><img
            height="15"
            src="/SigEditorHelper/GetEImage?ImgName=Phone_Icon.png"
            width="15"
          /><br />
          M (!Mobile!)<br />
          T (!Phone!)</span
        >
      </td>
      <td style="text-align:  center;font-size:9pt; ">
        <img
          height="15"
          src="/SigEditorHelper/GetEImage?ImgName=email_icon.JPG"
          width="15"
        /><br />
        (!Email!)<br />

      </td>
    </tr>
  </tbody>
</table>

Answer 1

<td style="text-align:  center;font-size:9pt; line-height: 0; vertical-align:top;">
    <img
      height="15"
      src="/SigEditorHelper/GetEImage?ImgName=email_icon.JPG"
      width="15"
    /><br />
    (!Email!)<br />

  </td>

试试这个

Answer 2

代码中似乎没有vertical-align:top；。 如果只希望用于电子邮件列，则可以对td元素执行内联样式。

<td style="vertical-align: top;">....

如果希望它们都有它，只需对所有td元素使用CSS即可。

td { 
   vertical-align: top;
}

null

td {
  vertical-align: top;
}

<table style="width:330px;">
  <tbody>
<tr>
  <td style="width:165px;">
    <img src="/SigEditorHelper/GetEImage?ImgName=100.jpg" />
  </td>
  <td style="width:165px; text-align:  center;">
    <span style="font-weight:bold; font-size:14pt;">(!DisplayName!)</span
    ><br />
    <span style="color:gray;font-size:12pt;">(!Position!)</span>
  </td>
</tr>
<tr>
  <td
    colspan="2"
    style="font-size:10pt;color:black;border-bottom:2px solid rgb(211,211,211);width:330px;"
  >
    Naseej International Trading Company (NITC).<br />
    Saudi Listed Entity,TASI:1213
  </td>
</tr>
<tr></tr>
  </tbody>
</table>

<table style="width:330px;">
  <tbody>
<tr>
  <td
    style="text-align:  center;font-size:8pt;border-right:2px solid rgb(211,211,211);"
  >
    <img
      height="15"
      src="/SigEditorHelper/GetEImage?ImgName=LocationPin_Icon.png"
      width="15"
    /><br />
    <span style="font-size:8pt;"
      >P.O.Box 31279<br />
      Jeddah,21497<br />
      Saudi Arabia</span
    >
  </td>
  <td
    style="text-align:  center;font-size:8pt; width:100px;border-right:2px solid rgb(211,211,211);"
  >
    <span style="font-size:8pt;"
      ><img
        height="15"
        src="/SigEditorHelper/GetEImage?ImgName=Phone_Icon.png"
        width="15"
      /><br />
      M (!Mobile!)<br />
      T (!Phone!)</span
    >
  </td>
  <td style="text-align:  center;font-size:9pt; ">
    <img
      height="15"
      src="/SigEditorHelper/GetEImage?ImgName=email_icon.JPG"
      width="15px"
    /><br />
    (!Email!)<br />
    WWW.Nassejco.com
  </td>
</tr>
  </tbody>
</table>