1、利用负边距方法,绝对定位使容器相对屏幕绝对居中,此时的被嵌套容器只能为绝对大小。(标准)
<div style="background:#f00; width:740px; height:340px; left:50%; margin:-170px 0 0 -370px; position:absolute; top:50%;"></div>
2、老外给出的另类方法,巧妙利用display:inline-block;,IE6.0测试通过。(标准)
注意height:100%是关键,edge与container没有嵌套关系:
<style>
body { margin:0; height:100%;}
#edge { width:0; height:100%; display:inline-block; vertical-align:middle;}
#container { text-align:center; width:100%; display:inline-block; vertical-align:middle;}
</style>
<!-- required for xhtml1.1 validation only -->
<span id="edge"></span>
<span id="container">
<div style="width:200px; height:50px; background:#f00; line-height:50px;">仅IE6.0环境下实现</div>
</span>
还有不介绍了...