父级div使用display:table-cell；vertical-align:middle会出现空隙。

父级div使用display:table-cell；vertical-align:middle会出现空隙。

1、html如下

 <div class="divCon">
    	<img  src="katong.png" />
 </div> 

2、css

.divCon{
	width:200px;
	height:200px;
	background:black;
	display: table-cell;
	vertical-align: middle;
	text-align:center;
}

.divCon img{
	width: 100%;
	height:100%;
}

3、显示效果：

4、问题：如上面红色圈出所示，父框会多出3px的高度

5、解决方法：

    a、让vertical-align在img中失效，给img设置display:block;使vertical-align:middle失效，因为它对块级元素不生效

    b、给Img设置ling-height:0px

    c、给父级div设置font-size:0

6、正常显示效果：