什么是一个实用的解决方案,可以在
HTML,IE6和IE7中使用
HTML中的纵向和横向内容？
一些细节：
>我正在寻找整个页面的解决方案.
>您只需要指定要居中的元素的宽度.在设计时间内不知道元素的高度.
>最小化窗口时,只有当所有空白区域消失时才会出现滚动.
换句话说,屏幕宽度应表示为：
“leftSpace width =(screenWidth-widthOfCenteredElement)/ 2”
“centeredElement width = widthOfCenteredElement”
“rightSpace width =(screenWidth-widthOfCenteredElement)/ 2”
高度相同：
“topSpace height =(screenHeight-heightOfCenteredElement)/ 2”
“centeredElement height = heightOfCenteredElement”
“bottomSpace height =(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-->
