IE6/7下两张图片拼在一起,中间白线问题
今天在处理一个bug的时候发现IE6/7下面的一个没见过的bug
通常在将两者图片拼成1张完整的图片的时候,为消除IE下的白线【图中所示】,都会给img加一个display:block样式。
但是我昨天遇到一个bug,加block之后反而出现了白线。仔细一排除原来是样式重置中的一句惹得祸!
<style type="text/css"> body{margin:0;padding:0} img,a img{border:0} img,select,input,button{vertical-align:middle} //产生问题的一句 #main{width:960px;margin:50px auto} #main img{display:block} </style> <div id="main"> <img src="images/3_01.jpg" width="720" height="70" alt=""/> <img src="images/3_02.jpg" width="720" height="70" alt=""/> </div>
vertical-align:middle 和block 其中任意一个都能使两张图片紧贴在一起,但是同时使用白线就会出现