魔术表对CSS免疫，这个魔法是什么？

Question

我有一个超级简单的HTML表格：

        <table class="dispdtab">
            <tr>
                <td><b>Dealer: </b></td>
                <td>dealername</td>
            </tr>
            <tr>
                <td><b>Address: </b></td>
                <td>123 main srr</td>
            </tr>
            <tr>
                <td><b>Contact: </b></td>
                <td>Bob Dole</td>
            </tr>
        </table>

我只是试图把这个愚蠢的桌子放在中心但是它还没有开始。它。我一直在努力，但桌子一直在嘲笑我，指着我的失败而嘲笑。

这是我尝试过的一些CSS：

.dispdtab {
    margin:0 auto;
    text-transform:uppercase;
    font-size:.8em;
}
.dispdtab td{
    padding:0 .25em;
}

我尝试在类名后添加tbody。我已经尝试添加display:block;我要回老去做其中一个坏男孩<center>...</center>

值得注意的是，当我添加border:1px solid black;时，只有第一行受边界影响。

我做错了什么？

Answer 1

如果您查看下面的代码，您可以看到该表实际上是居中的，但我必须给浮动div一个宽度以实现此目的。如果您查看代码并删除width上的div声明，则其宽度默认为表格的计算宽度，table居中不再明显。

在您的网页设计中，始终值得注意为对象提供尺寸。我们被告知我们的设计应该尽可能流畅，但有时候以像素为单位指定宽度/高度并不羞耻。诀窍是知道何时有必要。

http://jsbin.com/oJuxoQU/1/edit