html - 居中显示 :table div

Question

我有一个全宽包装器 div。在其中，还有另一个 div 设置为 display: table。

我已将包装器设置为 text-align: center，但表格 div 没有居中。这是为什么？为了使 display: table div 在包装器内水平居中，我在这里缺少什么？

See JsFiddle here

<div class="wrapper">
    <div class="tb">
        <div class="tb-cell">1</div>
        <div class="tb-cell">2</div>
        <div class="tb-cell">3</div>
    </div>
</div>

CSS:

.wrapper {
    width: 100%;
    background: #E0E0E0;
    text-align: center;
}

.tb {
    display: table;
    width: 100px;
    background: silver;
}

.tb-cell {
    display: table-cell;
}

Answer 1

将这个添加到类中:

.tb {
    display: table;
    width: 100px;
    background: silver;
    margin: auto;
    overflow: hidden;
}

演示:http://jsfiddle.net/gpq95d26/3/