垂直對齊div，外部div不增長

Question

我有幾個嵌套divs，我需要垂直居中嵌套divs之一。通常我會通過給予外部div的css屬性position: relative和內部div屬性position: absolute來做到這一點。然後我可以很容易地使用top和left來定位div。

但我不能用我目前的結構來完成它。這裏有一個例子：

http://jsfiddle.net/Epmd4/2/

所以從這個例子基本上與藍色邊框的股利應垂直居中綠色DIV中。但我無法完成。

任何人有任何想法如何做到這一點？

PS。我只能只有將css屬性添加到.item div以及其中的所有內容。

Answer 1

試試這個：

.item { 
    /*position: relative;*/ 
    background: #00FF66; 
    min-height: 60px; 
    display:table-cell; 
    vertical-align:middle; 
} 

jsFiddle example

對於這個在IE7工作，一個JavaScript的手段是必要的：

$(document).ready(function(){ 
    if($.browser.msie && $.browser.version == 7) { 
     $(".tablecell").wrap("<td />"); 
     $(".tablerow").wrap("<tr />"); 
     $(".table").wrapInner("<table />"); 
    } 
}); 

剛剛與中適當的更換.table*類。