如何使用html和css水平和垂直居中IMG标签，即7？

Question

我在我的html中添加'a'标签并添加相对于它的位置然后在'a'标签中添加'img'标签并添加绝对位置，左0，右0，前0，下0，边距自动' img'标签。

此代码在ie7中不起作用。在其他浏览器中它工作正常。

我的代码中有什么问题？

我创建代码如下：

HTML：

<a href="#" class="img-link-wrap"><img alt="Image 1" src="img/501.jpg"></a>

CSS：

a.img-link-wrap {
border: 1px solid #999;
display: block;
position: relative;
height: 11em;
width: 10em;
text-align: center;
}

a.img-link-wrap img {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
margin: auto;
}

感谢你。

Answer 1

不确定它是否有效但尝试将overflow: hidden;添加到a代码

的样式中

Answer 2

将元素居中，请使用以下代码段：

.centered {
  position: based on your choice;
  top: 50%;
  left: 50%;
  margin-top: -(element_height/2);
  margin-left: -(element_width/2);
}