IE7的一个边界BUG

昨天刚刚发现的。

我做了个页面,文字输入框用的是背景图上的文字框,因此想让input不显示边框后和底图上的文字框对齐。

本来很简单的事情,算一下左边距,css里写一下就OK了。事实上我用IE6,IE8,Fx,Chrome看了一下都没问题。就收工了。

但回家用IE7一看,傻眼了。整个就乱了。于是跑回公司,用IE8的兼容模式一看,也是乱的。

最后发现乱的原因是input框和form之间有一段距离,我试着调了form的padding,input的margin,都没用,这段边距如论如何都去不掉。

最后火了,新建了一个空白文档一步步写style,最后惊奇的发现,居然没问题,input和form是紧贴着的,并没有间距。这是怎么回事?

最后对比了两个html,发现了问题所在。

有问题的html里,我在form外套了两个div,这两个div都设置了25的margin-left。结果form里的input就继承了2个margin-left,并且还叠加了,变成了margin-left=50!

这真是个诡异的BUG,因为不仅强制指定input的margin-left=0px;不起作用, 而且这个左边距居然还会叠加继承。实在是诡异。

最后我删除了外面两个DIV的左边距才解决了这个问题,不知道有没有高人有更好的解决方法。

posted @ 2009-06-03 14:26  蓝色的风之精灵  阅读(629)  评论(2编辑  收藏  举报