1

请参阅 Pastebin，我正在尝试将“立即免费构建”按钮居中，但由于某种原因align="center"无法正常工作。我究竟做错了什么？

我的代码很长..
所以我把它放在这里：Pastebin

这是我需要居中的代码部分（我的按钮）：

<tr>
    <td align="center" width="240" bgcolor="#cf142b" style="background: #cf142b; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; color: #ffffff; font-weight: bold; text-decoration: none; display: block;"><a href="" style="display:block;color: #fff; text-decoration: none; padding:15px 10px 15px 10px;">BUILD FOR FREE NOW</a>
    </td>
</tr>
4

2 回答 2

3

您必须将这些样式属性从您的标签移动到您的标签。

                    </td>
                </tr>
                <tr>
                    <td style="padding: 30px 20px 30px 20px;">
                        <table border="0" cellpadding="0" cellspacing="0" width="100%" style="font-size:16px;color:#666666;">
                            <tr>
                                <td> <b>Hello, Mike!</b>

                                </td>
                            </tr>
                            <tr>
                                <td style="padding: 20px 0 20px 0;">Lorem ipsum dolor sit amet!</td>
                            </tr>
                            <tr>
                                <td>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In tempus adipiscing felis, sit amet blandit ipsum volutpat sed. Morbi porttitor, eget accumsan dictum, nisi libero ultricies ipsum, in posuere mauris neque at erat.</td>
                            </tr>
                            <tr>
                                <td style="color:#444444;padding: 20px 0 20px 0;"> <b>Lorem ipsum dolor sit amet, consectetur adipiscing elit!</b>

                                </td>
                            </tr>
                            <tr>
                                <td align="center"><a href="" style="width:240px; background: #cf142b; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; color: #ffffff; font-weight: bold; text-decoration: none; display: block; padding:15px 10px 15px 10px;">BUILD FOR FREE NOW</a>

                                </td>
                            </tr>
                        </table>
                    </td>
                </tr>
                <tr>
                    <td>Call to Action</td>
                </tr>
                <tr bgcolor="#0B5EA8">
                    <td>Footer</td>
                </tr>
            </table>
        </td>
    </tr>
</table>

小提琴：http: //jsfiddle.net/cCeNd/

让我知道它是否是您要找的那个。

于 2013-07-06T22:13:26.343 回答
1

编辑：我将错误的元素居中。

你试过margin: 0 auto;吗？这可能不是跨客户端，但你的圆角也不会。

另一种选择是制作一个 3 单元格的表格来伪造按钮居中。

于 2013-07-06T22:05:27.867 回答