html - 在FF，IE6和IE7中运行的HTML中垂直和水平居中的实用解决方案

在Firefox，IE6和IE7中可以正常使用的将HTML内容垂直和水平居中的解决方案是什么？

一些细节:

我正在寻找整个页面的解决方案。

您只需要指定要居中的元素的宽度。元素的高度在设计时未知。

最小化窗口时，仅当所有空白都消失时才应显示滚动。
换句话说，屏幕的宽度应表示为:

“leftSpace width =(screenWidth-widthOfCenteredElement)/2” +
“centeredElement width = widthOfCenteredElement” +
“rightSpace宽度=(screenWidth-widthOfCenteredElement)/2”

和高度相同:

“topSpace高度=(screenHeight-heightOfCenteredElement)/2” +
“centeredElement height = heightOfCenteredElement” +
“bottomSpace高度=(screenWidth-heightOfCenteredElement)/2”

实际上，我的意思是表的使用是可以的。我打算将这种布局主要用于登录之类的特殊页面。因此，CSS纯度在这里并不是那么重要，而为了将来的兼容性，遵循以下标准是可取的。

最佳答案

从http://www.webmonkey.com/codelibrary/Center_a_DIV

#horizon
    {
    text-align: center;
    position: absolute;
    top: 50%;
    left: 0px;
    width: 100%;
    height: 1px;
    overflow: visible;
    display: block
    }

#content
    {
    width: 250px;
    height: 70px;
    margin-left: -125px;
    position: absolute;
    top: -35px;
    left: 50%;
    visibility: visible
    }

<div id="horizon">
   <div id="content">
      <p>This text is<br><emphasis>DEAD CENTRE</emphasis ><br>and stays there!</p>
   </div><!-- closes content-->
</div><!-- closes horizon-->