儘管有 css 的 vertical-align 特性，但是並不能有效解決未知高度的垂直居中問題（在乙個 div 標籤裡有未知高度的文字或的情況下）。
標 準瀏覽器如 mozilla, opera, safari 等.，可將父級元素顯示方式設定為 table(display: table;) ，內部子元素定為 table-cell (display: table-cell)，通過 vertical-align 特性使其垂直居中，但非標準瀏覽器是不支援的。
非標準瀏覽器只能在子元素裡設距頂部 50% ，裡面再套個元素距頂部 -50% 來抵消。
css部分：
body
body,html
#outer
#outer[id]
#middle /* for explorer only*/
#middle[id]
#inner /* for explorer only */
div.greenborder
以上 css **的優點是沒有 hacks，採用了 ie 不支援的 css2 選擇器 #value[id] 。
css2選擇器 #value[id] 相當於選擇器 #value ，但是 internet explorer 不支援這種型別的選擇器。同樣地 .value[class] ，相當於 .value ，這些只有標準瀏覽器能讀懂。
測試：firefox1.5、opera9.0、ie6.0、ie5.0通過。
原文：vertical centering in css (yuhu』s definitive solution with unknown height)
CSS解決未知高度垂直居中
儘管有css的vertical align特性，但是並不能有效解決未知高度的垂直居中問題 在乙個div標籤裡有未知高度的文字或的情況下 標準瀏覽器如mozilla,opera,safari等.可將父級元素顯示方式設定為table display table 內部子元素定為table cell dis...
CSS解決未知高度垂直居中
vertical centering in css 儘管有css的vertical align特性，但是並不能有效解決未知高度的垂直居中問題 在乙個div標籤裡有未知高度的文字或的情況下 標準瀏覽器如mozilla,opera,safari等.可將父級元素顯示方式設定為table display t...
CSS解決未知高度垂直居中
儘管有 css 的 vertical align 特性，但是並不能有效解決未知高度的垂直居中問題 在乙個 div 標籤裡有未知高度的文字或的情況下 標準瀏覽器如 mozilla,opera,safari 等.可將父級元素顯示方式設定為 table display table 內部子元素定為 tabl...