用margin使input 产生的双倍
这是在ie6和ie7里出现的bug，上下的文字 “test”都在左边，而input框却距离左边100px，他们都在一个div里面同级。并没有对input框设置边距。
html
css
#div{
margin-left:100px;
}
#div .input{
padding:0px;
background:#666;
height:30px;
}
看看html的结构，最外面的div上面加上了margin-left:100px;左边有100px的宽度空白，是正确的效果，但是在最里面的input框竟然距离外面的div的距离还有100px的宽度，产生了双倍的距离，神奇的是为什么上下的文字没有产生双倍。
在<div class=”input”>和input框之间插入一个文字，奇迹发生了，竟然input的双倍没有了，我网上找了找，网上有下面这种解决方法。
在<div class=”input”>和input框之间插入<span style=”width:0;overflow:hidden;display:inline-block;float:left;”> </span>
看看他的原理就是在<div class=”input”>和input框之间插入一个0px宽度的元素，这样既能让input消除双倍，还不占用空间。
这样总归多谢了一行代码，感觉不爽，想想既然产生双倍，那就用平时处理的方法，清空float，其实整个css都没有用float，但是还是试试看吧。
在#div的css里面加上了清空css的代码，也是我常用的清空方法：
overflow:auto;
_display:inline-block;
测试结果ok了，很神奇吧，根本就没用到float，也要用清空浮动。
有一种更简单的方法，在#div的css加上高度：
height:50px;
还有一种方法，就是不用margin-left，改成padding-left，一样可以搞定这个问题（打不过我跑还不行吗）。同样能搞定input的双倍的问题，这个原理就是和清空float的原理一样。
到现在，我还是不知道ie6和ie7 为什么会产生这样的问题？到底是不是产生双倍的问题？又为什么其他文字没有双倍？希望知道的童鞋给我留个言，谢谢！
