垂直居中在另一個元素的元素在Internet Explorer

Question

請查看：

http://jsfiddle.net/UvvPC/

我想使用邊距移動灰箱在JS小提琴以上。

我希望灰盒子在黑盒子的中間，但我被告知margin-top與Internet Explorer不兼容。

我該用什麼來代替？

謝謝！在元素上

Answer 1

使用邊距吧:)

Answer 2

我不知道爲什麼你需要使用margin-top做這個任務之前。這可以幫助你：

.one { 
    background: #151515; 
    height: 700px; 
    width: 900px; 
    margin: 0px auto; 
    padding: 0px 0px 0px 0px; 
    display:table-cell; 
    vertical-align:middle; 
} 

Answer 3

使用display: table-cell不會IE6-7工作。如果這是你所關心，你可以使用以下方法：

.one { 
    background: #151515; 
    height: 700px; 
    width: 900px; 
    margin: 0px auto; 
    padding: 0px 0px 0px 0px; 
    position: relative; 
} 

.two { 
    background: #e6e6e6; 
    height: 140px; 
    width: 900px; 
    position: absolute; 
    top: 50%; 
    margin-top: -70px; /* half of the height */ 
} 

http://jsfiddle.net/HYjke/