IE7中的垂直对齐 [英] Vertical alignment in IE7

问题描述

我使用CSS创建一个无表的布局。虽然这在IE8，FireFox和Chrome正常，它不在IE7，我预期。但我想知道是否有任何解决方案 vertical-align：middle; 。这似乎是我的问题在IE7的核心。

I have used CSS to create a tableless layout. While this renders properly in IE8, FireFox and Chrome, it does not on IE7, which I expected. But I was wondering if there was any solution for vertical-align: middle;. This seems to be the core of my problem in IE7.

#main { 
    margin: 0 auto;
    height: 500px;
    display: table;
   position: relative;
}

#main ul {
    display: table-cell;
    vertical-align: middle;
    text-align:center;
}
#main ul li {
    display: inline-block;
    margin: 10px;
    border: 1px solid #d0dad2;
    height: 170px;  
}

<div id = "main">
    <ul> 
        <li><img src="images/test.jpg" alt="staff" /></li>
    </ul>
</div>

推荐答案

Chris Coyier看看这篇教程：
http://css-tricks.com/vertically-center-multi-lined-text/

Have a look at this tutorial by Chris Coyier: http://css-tricks.com/vertically-center-multi-lined-text/

希望这有助。

这篇关于IE7中的垂直对齐的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！