html - 将两个按钮对齐到一行的中心

标签 html css html-email

我有以下代码片段:

<tr>
    <td>
        <a style="text-decoration:none;font-family:Gotham,
                 'Helvetica Neue', Helvetica, Arial, sans-serif;color:#ffffff;
                 background:#d95b23;width:170px;text-align:center;line-height:40px;
                 height:40px;display:block;font-size:15px;" href="%24%7BloginLink%7D">
                 Yes, Integrated</a>
    </td>
    <td>
        <a style="text-decoration:none;font-family:Gotham, 
                 'Helvetica Neue', Helvetica, Arial, sans-serif;color:#ffffff;
                 background:#d95b23;width:170px;text-align:center;line-height:40px;
                 height:40px;display:block;font-size:15px;" href="%24%7BloginLink%7D">
                 No, Yet to Integrate</a>
    </td>
 </tr>

它在一行内作为两个单独的列。两个按钮都在最左边和最右边。如何将它们彼此靠近并置于中心?

我尝试过添加边距和 float ,但没有成功。

有人可以提供快速帮助吗?

最佳答案

这是对您的 JSFiddle 的更新

您需要添加一个 colspan到跨越包含您的按钮的 2 列的一次,否则按钮将不知道它们应该是什么大小,并且也将忽略大小作为第一个 <td>想要成为 <td> 的大小它上面。

<td colspan="2" style="font-family:Arial, Helvetica, sans-serif;font-size:13px;color:#666666;line-height:22px;">
                                    Help us assist you better. Let us know if you’ve successfully completed your payment gateway integration.
                                  </td>

完成后,您需要添加

<td align="center">

如果你想在你的按钮周围添加一点填充,你可以像这样将它添加到 td 上:

<td align="center" style="padding:10px;">

更新的fiddle with padding

关于html - 将两个按钮对齐到一行的中心,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42530444/

相关文章:

html - td 标签中的表格,我希望表格从顶部开始我如何才能实现?

HTML5 电子邮件输入模式属性

javascript - 单击文本时如何来回交换文本?

jquery - 单击 mailto 链接后如何切换 2 div 的可见性?

javascript - jQuery 整体平滑滚动而不是 DIV

html-email - 电子邮件中的 Schema.org 标记

html - 在时事通讯中的多个表格行上显示图像

javascript - 如何检测动态添加的 css 类

javascript - 为什么我的交通灯代码不起作用?

javascript - 图表在 Chrome 中呈现,但在 FF 和 IE 中不呈现