CSS实现未知高度图文混合垂直居中

（从已经死了一次又一次终于挂掉的百度空间人工抢救出来的，发表日期 2014-06-26）

CSS实现未知高度图文混合垂直居中,阅读CSS实现未知高度图文混合垂直居中。

IE6,IE7,FF3测试通过

CSS* { margin:0; padding:0; list-style:none;}

#vertical_box {

width:100%;

display:table;

border:1px red solid;

height:400px;

/*针对IE的hack*/ *position:relative;

}

#vertical_box_sub {

display: table-cell;

vertical-align: middle;

/*针对IE的hack*/ *position:absolute; *top:50%;

}

#vertical_box_container {

font-family:"宋体";

border:1px green solid;

/*针对IE的hack*/ *position:relative; *top:-50%;

margin:0 auto; width:200px;

}

HTML
<div id="vertical_box">    
<div id="vertical_box_sub">        
<div id="vertical_box_container">            
<p>我是居中的文字</p>            
<p>我居中</p>            
<p>你也居中</p>            
<img src="" border=0 alt="\" title="">        
</div>    
</div></div>