讨论了好久的问题，IE、Firefox下CSS图片垂直居中的问题

 

通过百度和谷歌找了好久都没找着一个合适的方法。以下是自己找出的一种方法，自认为还可以，而且，也方便简单。

 

IE:当容器为div,或者tr,只要把容器的Css属性line-height设置成容器的高度就行了.

当容器为a,且容器的css属性display为inline-block或者block时,除了要把容器的Css属性line-height设置成容器的高度外,还要把图片的css属性display设置成list-item;

Firefox:当把容器的css属性display设置成table-row时,css属性text-align属性生效,css属性vertical-align属性也生效，css属性不能设置成float;.

 

因此一个图片垂直居中的代码可以写成

 

<style type=”text/css”>

.div1

{

Line-height:200px;text-align:center;

}

</style>

<div class=”div1” style=”display:table-row; vertical-align:center; text-align:center;”><img src=”1.jpg” style=”height:200px;”></div>