html签名垂直分割tr答案

【问题标题】：html signature vertically split trhtml签名垂直分割tr
【发布时间】：2017-04-28 10:29:48
【问题描述】：

我正在使用 html 和表格制作电子邮件签名。我快到了，但只需要最后一点。

我想要右边的社交图标。我附上了截图，这里是代码。

<table> <tr> <td valign="top" style="padding:0 8px 0 0;"><img src="" style="max-height:80px" width="76" height="80"></td> <td style="font-size:80%;font-family:Arial;padding:0;  min-width:240px;" valign="top"> <div style="color:#111111;font-size:1.4em;">Name</div> <span style="color:#111111;"><strong style="color:#111111;font-size:1em">Director</strong>,</span> <span style="color:#111111;font-size:1em;">Company</span>  <div style="line-height:0.4em;font-size:0.4em;"> &nbsp; </div>   <div><span style="color:#00c4b4;font-size:1em;">mobile:&nbsp;</span><span style="color:#111111;font-size:0.9em;">07777777777</span></div>  <div><span><a href="https://www." target="_blank" style="color:#00c4b4;text-decoration:none;font-size:1em;">www.website.com</a></span></div>   </td> <td style= "border-left:2px solid;padding:0 0 3px 6px;width:42px;border-color:#00c4b4;"valign="middle"> </td> </tr>         <tr>
        <td><img src="https://htmlsigs.s3.amazonaws.com/logos/files/000/747/072/landscape/facebook-5-128_1_.png" style="max-height:40px" width="40" height="40"></td>
    </tr>
    <tr>
        <td><img src="https://htmlsigs.s3.amazonaws.com/logos/files/000/747/073/landscape/linkedin-5-128_1_.png" style="max-height:40px" width="40" height="40"></td>
    </tr></table>

【问题讨论】：

jsfiddle.net/gvvL7f4p 要减少图像和边框之间的间隙，请将所需宽度设置为之前的 td（带有绿色边框，现在它太宽了，42px），并将图像左对齐...例如像这样：jsfiddle.net/gvvL7f4p/1
非常感谢！

标签： html html-table html-email signature

【解决方案1】：

您需要将右 td 拆分为 2 行。这是更正后的代码。

<table> 
<tr> 
<td rowspan="2" valign="top" style="padding:0 8px 0 0;"><img src="" style="max-height:80px" width="76" height="80"></td> 
<td rowspan="2" valign="top" style="font-size:80%;font-family:Arial;padding:0;  min-width:240px; border-right:2px solid; border-color:#00c4b4;"> 
<div style="color:#111111;font-size:1.4em;">Name</div> 
<span style="color:#111111;"><strong style="color:#111111;font-size:1em">Director</strong>,</span> 
<span style="color:#111111;font-size:1em;">Company</span>  
<div style="line-height:0.4em;font-size:0.4em;"> &nbsp; </div>   
<div>
<span style="color:#00c4b4;font-size:1em;">mobile:&nbsp;</span>
<span style="color:#111111;font-size:0.9em;">07777777777</span>
</div>  
<div>
<span>
<a href="https://www." target="_blank" style="color:#00c4b4;text-decoration:none;font-size:1em;">www.website.com</a>
</span>
</div>   
</td> 
<td style= "padding:0 0 3px 6px;width:42px;"valign="middle">
<img src="https://htmlsigs.s3.amazonaws.com/logos/files/000/747/072/landscape/facebook-5-128_1_.png" style="max-height:40px" width="40" height="40">
</td> 
</tr>
<tr>
<td style= "padding:0 0 3px 6px;width:42px;"valign="middle">
<img src="https://htmlsigs.s3.amazonaws.com/logos/files/000/747/073/landscape/linkedin-5-128_1_.png" style="max-height:40px" width="40" height="40">
</td>
</tr>         
</table>

【讨论】：