如何在页面中居div? (高度和宽度)?

时间:2011-10-11 15:46:27

标签: css html position

愚蠢的问题,但我无法找到答案,因为所有的答案都假定以宽度为中心的div。

我需要的是以高度和宽度为中心div,以便在页面的正中心。

我尝试了这个,但它只是以页面宽度无高度为中心div。

#myDiv {
   width: 500px;
   height: 500px;
   margin: auto;
}

那么如何才能在页面的非常中心获取它? )))

2 个答案:

答案 0 :(得分:2)

position: absolute;
left: 50%;
top: 50%;
margin-left: -250px; /*(half of width)*/
margin-top: -250px;  /*(half of height)*/

应该有用。

答案 1 :(得分:2)

wrapper元素周围创建ID为#myDiv的包装器,并应用此CSS代码:

#wrapper{
    display: table;
}
#myDiv{
    display: table-cell;
    vertical-align: middle; /*Vertically centered*/
    text-align: center; /* Horizontally centered */
}

此代码将任何宽度/高度的元素居中。