本例设计动态高度下的居中方法，旨在设计当容器高度发生变化时，元素仍然保持垂直方向上的居中。
【示例】
-
HTML
<body> <div id="page"> <div id="content_container"> <div id="content"> <p>网页内容</p> </div> </div> </div> </body> -
CSS
* { margin: 0; padding: 0; } #page { display: table; overflow: hidden; margin: 0px auto; } *:first-child+html #page { position: relative; }/*ie7*/ * html #page { position: relative; }/*ie6*/ #content_container { display: table-cell; vertical-align: middle; } *:first-child+html #content_container { position: absolute; top: 50%; }/*ie7*/ * html #content_container { position: absolute; top: 50%; }/*ie6*/ *:first-child+html #content { position: relative; top: -50%; }/*ie7*/ * html #content { position: relative; top: -50%; }/*ie6*/ html, body { height: 100%; } #page { height: 100%; width: 465px; border:solid 1px red; }