CSS-如何水平中心桌谁是绝对的

Question

我有一个具有相同代码的5 HTML页面。说这是代码：

<div id='generic'>
</div>

所有5页链接到同一外部CSS文件，这就是这样：

<style>
    #generic {
        width: 700px;
        height: 500px;
    }
</style>

在5页中的每一个中，我都插入了一张桌子，

<div id='bottomBar'>
    <table id='bottomTable'>
        <tr id='bottomTr'>
        </tr>
    </table>
</div>

该桌子只有一排。在一行中，我需要从1-10中选择一个随机数，这就是TD的行要有的。因此，第一个HTML页面可以具有2个TD，第二个可以具有6TD等。我需要做到它，以使表的垂直位置在所有页面中都相同，但是表必须水平对齐。我必须使用绝对位置，因为其他用户可能会在某些页面上键入表格前的几段，并且在某些页面上，可能没有其他段落，所以为了使我拥有相同的垂直位置，我需要位置绝对。我如何做到这一点，以便每张桌子水平居中？通过水平对齐，我的意思是，每个桌子在左侧和右侧都有均匀数量的空白，无论桌子有多少台。

margin: 0 auto;

对我不起作用。请注意，我不使用CSS3，并且正在使用IE8。

Answer 1

margin: 0 auto 无法为绝对定位元素工作。您需要做的是绝对位置在中间。您可以通过将其移动50％来实现这一目标；然后将左边边缘调整为元素宽度的负一半

#bottomTable {
 position: absolute;
 width: 700px;
 left: 50%;
 margin-left: -350px; /*Half the width of your element*/
}

这将把它置于父母的中间

PS。确保将父容器位置设置为相对

http://jsfiddle.net/s7gmm/3/