最近遇到的问题：两个div之间明明设置了margin:0;padding:0，但两个div之间还是有间距
可能还会遇到，在两个input标签，或者input与span标签之间，会产生多余3个象素空格的问题。
如下图：
空格测试
代码如下：
<style> input{width: 120px; height: 30px;}</style>
<body>
<input type="text" value="空格"> <input type="text" value="测试">
</body>
我们明明没有设置边距，可是中间为什么会有差不多3个象素的距离呢？一时间摸不着头脑，估计是浏览器搞的鬼，具体也不想深究。直接找办法解决。
一、简单粗爆不换行
写代码的时候不要换行，input等在一行输写。但是代码就变得不再那么容易好看。
二、设置父级块的字体大小为0
这样也能解决问题，代码也好看，但是当你设置了父级的font-size:0时，你里面又要其它字体要显示，可能其他元素要重新设置字体大小。
如下：
<style> body{font-size: 0} input{width: 120px; height: 30px;}</style>
<body>
<input type="text" value="空格"> <input type="text" value="测试">
</body>
空格测试
三：设置margin-left:-3px;
使得该元素基于原来的位置向左偏移三个象素，也就看不出有空隙了。
我选择第一种解决办法，希望其他同事更新代码后不要去格式化那段代码。
网友评论