IE7垂直对齐中间 - 不工作

时间:2012-06-12 14:20:21

标签: html css

请在下面链接中找到

http://jsfiddle.net/anglimass/Y8AvM/

我只想要我的div来垂直对齐中间ie7。

有人可以帮忙吗?

由于


对不起伙计们,

我找到了一个好的解决方案 请参阅下面的链接,

http://jsfiddle.net/anglimass/ct4tx/

谢谢,

价:http://css-tricks.com/snippets/css/exactly-center-an-imagediv-horizontally-and-vertically/

1 个答案:

答案 0 :(得分:23)

它在IE7中不起作用,因为IE7 does not support display: table-cell

我甚至told you this before.

这是另一种在IE7中可行的垂直居中技术:How to vertically align an image inside 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。