css - 如何使这张 table 居中？

Question

如何让这个表格居中？

我试过 margin-left: 50% 和 margin-right: 50% 但没有结果。

http://jsfiddle.net/WtJxT/ [1]

注意:表格列必须保持原来的大小，不能折叠。

[1]:

.tic {
    display : table; 
    width : 700px; 
    border:solid 7px #c9c9c9;
    height : 97%;
    position: absolute;
    margin-left: 120px;
}

Answer 1

.tic
{
  display : table; 
  width : 700px; 
  border:solid 7px #c9c9c9;
  height : 97%;
  position: relative;
  margin: 0 auto;
}

为什么这有效？

如您所见，我修改了您的 CSS 代码段中的两个属性。首先 position: relative;。使位置相对使 div.tic 相对于它的父容器。第二个属性是 margin: 0 auto;。 auto 属性告诉浏览器设置边距，以便 tic 和它的外部容器之间的空白空间从两侧(左侧和右侧)相等，0 设置 margin-top 和 margin-bottom 为 0。