使用display:table-cell元素部分出現空白縫隙的結解決_學習筆記

 <div class="hotelPicDiv">    <div><img class="hotelPic" src="resources/images/hotel/40793bc11d7351dae2ebfc9135856832.jpg" /></div>  </div>

.hotelPicDiv{ width:3rem; height:3rem;overflow:hidden; float:left; margin:0.345rem 0.285rem; display: table;}.hotelPicDiv div{ display:table-cell; vertical-align:middle; line-height: 0;}.hotelPic{ width:100%;}

此處終點標註關鍵三個屬性. hotelPicDiv{ display: table;}
.hotelPicDiv div{ display:table-cell; vertical-align:middle; line-height: 1;}

重中之重： line-height: 1;

解決縫隙的關鍵就是他了，原理請參考：http://blog.csdn.net/hmily_hui/article/details/54614028