1


我正在处理一个页面..其中 Margin 0 auto 在带有 display:table 单元格的 div 中不起作用
这是我的代码

CSS Styles

<style>
    html,body{
        height:100%;
        width:100%;
    }
    .wrapper{
        background-color:#999;
        height:500px;
    }
    .tableContent{
        display:table;
        height:500px;
    }

    .tableContentRow{
        display:table-row;
    }

    .tableContentCell{
        display:table-cell;
        vertical-align:middle;
        height:500px;
    }

    .loginBox{
        height:100px;
        background-color:#FFF;
        width:250px;
        margin:0 auto;
    }
</style>

这是HTML

<div class="wrapper">
    <div class="tableContent">
        <div class="tableContentRow">
            <div class="tableContentCell">
                <div class="loginBox">
                     <!-- More contents Go HEre -->
                </div>
            </div>
        </div>
    </div>
</div>


loginBox div 未定位到 tableContentCell div 的中心
请帮助...

4

2 回答 2

3

在 div 上设置一个特定的宽度.tableContentCell，你会没事的。

小提琴

于 2013-04-08T14:19:12.380 回答
2

表格本身没有居中。检查这个小提琴。

.tableContent{
    margin:0 auto;
}
于 2013-04-08T14:17:53.330 回答