它在 IE7 中不起作用,因为 IE7不支持 display: table-cell
.
我什至已经告诉过你了。
这是在 IE7 中有效的另一种垂直居中技术:如何在 div 内垂直对齐图像
这是适用于您的代码的上述答案中最简单的技术版本:http: //jsfiddle.net/thirtydot/Y8AvM/1/
HTML:
<div class="inlay">
<span class="helper"></span><img src="http://goldstudios.net/uploader/uploads/Wildebeest_$1$2ryes3hf$Fl0tEsFaORwBW2seye9qN0.jpg" />
</div>
CSS:
html, body {
height: 100%;
background: #ddd;
}
.inlay {
height: 100%;
text-align: center;
}
.inlay img {
vertical-align: middle;
}
.helper {
display: inline-block;
height: 100%;
vertical-align: middle;
}
它适用于所有现代浏览器,当然还有 IE7。