css vertical-align:middle; 垂直居中的一個推薦方式（IE7+）（我的喜歡）

記錄一下：

採用 inline-block 方法：

HTML:

<div id="box">

<div id="content">我是內容<br />我也是內容</div>        

<i class="_actor"></i>

</div>

CSS:

#box { height: 400px; background: #c00;}

#content { display: inline-block; *display: inline; *zoom:1; vertical-align: middle;}

#content { font-size: 12px; color: #fff;}

._actor { width:0; font-size:0; height: 100%; display: inline-block; *display: inline; *zoom:1; vertical-align: middle;}

加粗體的部分是關鍵所在。

原理是：都顯示爲行框的高度由最高的行內框決定。

i._actor做爲演員，高度指定和父元素一致。

兼容性：支持inline-block的瀏覽器都可。

對於IE6/7，能夠先使用hack方式使其支持 inline-block後，使用此方法實現垂直居中。

來源：張鑫旭的博客