Question

我刚刚在FF3.5和Chrome 10中发现了一个奇怪的行为，这解释了为什么我的某些表格没有像我预期的那样对齐。

当在表格上设置CSS边距（或通过常规*选择器）时，align属性不再有效。

我意识到现在不推荐使用align，并且我们都应该使用容器的text-align样式设置表格对齐，但有时当你需要在包含div中的各种内容的不同对齐时，它仍然很方便。

IE（一次性）似乎是普通人并且不受保证金设置的影响。请查看： http://www.songtricks.com/AlignBug.html

这是代码 - 任何想法？

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
</head>

<body>

        <table border="1" width="50%" align="center" style="margin:0px;">
        <tr>
            <td>Table with style="margin:0px;"</td>
        </tr>
        </table>

        <table border="1" width="50%" align="center">
        <tr>
            <td>Table with no style</td>
        </tr>
        </table>

</body>
</html>

Answer 1

我不确定align属性是如何工作的，但是当你将margin-top或margin-bottom应用于它似乎不会影响它的样式时，它看起来就像。只有当您更改左右边距属性时才会导致此错误。我的猜测是align属性与margin：0 auto相同。当我为左右边距添加自动时，你会得到理想的结果。

<table border="1" width="50%" style="margin:0px auto;">
    <tr>
        <td>Table with style="margin:0px;"</td>
    </tr>
</table>

FF / Chrome中奇怪的表格对齐行为

1 个答案: