css - padding-left 在表格内

Question

我正在尝试构建一个我设计为通过电子邮件发送的时事通讯。我现在遇到的问题是文本周围的图像没有空间，我想更改 background-color将文本字段变为灰色，就像:



如果我给它一个新的 td是不是整个代码不再工作了，你能帮帮我吗？

这是完整的代码jsfiddle

<table width="600*" border="0" cellspacing="0" cellpadding="0" align="center">
    <tr><br>
        <td width="201" valign="top"  >
            <img src="images/angebot1.jpg" style="display: block;" border="0" width="201" height="394"/><br />
            <br />
        </td>

        <td width="291" valign="top">
            <img src="images/angebotbild1.jpg" style="display: block;" border="0" width="335" height="150"/>
            <div style="margin-top: 3px;"></div>
            <font color="#778da7" face="Trebuchet, Arial, Verdana, Helvetica, sans-serif" size="2" style="font-size: 12px"> the text </font><br><br>
            <a  href="#" alt="Book now" target="_blank" style="color:#cc1f2f; font-weight:bold; text-decoration:none;float:left"><img src="images/button.jpg" width="335" height="60" style="display:block;" border="0" /></a>
        </td>
    </tr>
</table>

Answer 1

您可以将字体标签包裹在 div 中。
然后添加 padding-left 并设置 display: inline-block。
背景颜色也可以应用于 td，因为其余部分将被图像覆盖。

谢谢