发生场合:一个元素浮动,然后一个不浮动的元素自然上浮与之靠近会出现的3px的间距。
以下为个人所做测试:
test01:不浮动元素为块级元素
立即学习“前端免费学习笔记(深入)”;
box01box02
登录后复制
.box01{float: left; background: #f1c100;}.box02{background: red;}
登录后复制登录后复制
ie6效果:没有出现3px间距
test02:不浮动的元素修改为行内元素
box01box02
登录后复制
.box01{float: left; background: #f1c100;}.box02{background: red;}
登录后复制登录后复制
ie6效果:出现3px间距
test03:修复这个3px间距 (方法一)
html结构按照test02,css如下:
.box01{float: left; background: #f1c100;}.box02{background: red;_margin-left:-3px;}/*_margin-left:-3px;修复3px间隔bug*/
登录后复制
效果:没有间距
test04:修复这个3px间距 (方法二)
结构同上,css如下:
.box01{float: left; background: #f1c100;}.box02{background: red;float: left;}/*让不浮动元素也浮动起来*/
登录后复制
效果:没有间距
小结:
据此,可以完善此bug 发生场合:一个元素浮动,然后一个不浮动的行内元素自然上浮与之靠近会出现的3px的间距。
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。
发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/3088396.html