IE6重复文字bug完美解决方案集合

CSS网站布局中,IE6.0重复文字一直以来都是一个臭名昭著的bug,让不少设计师头痛不已。正巧今天搞站又遇到了这个问题,所以,集中精力攻克了它。小车就从该bug的几种可能诱发其产生的条件到解决方法进行一个简单分析。

IE6重复文字的几种形成条件

  • 两个浮动元素之间放置注释
  • 某容器内所有元素浮动,且该容器未清除浮动
  • 某容器内有多个浮动的内联元素
  • 3像素bug出现的时候
  • 内联元素之间有空格
  • 不正确的doctype

IE6重复文字BUG的解决方法

  • 确保所有的元素使用display:inline;
  • 在最后一个元素上使用一个margin-right:-3px;
  • 为浮动元素的最后一个条目使用一个条件注释,比如:
    <!–[if !IE]>注释信息…<![endif]–>
  • 在容器的最后元素使用一个空的div
  • 去掉多余(可能未必多余,但是我们没有选择)的空格或者回车
  • 修改成正确的doctype

以上这些方法挨个试一下,总有一个适合你。今天我遇到的这个,添加了空div解决了问题,限于时间原因,我就不放我的案例了,大家多试验,以上这些方法应该足够了。

 

Published by 小车

网站技术工人

One reply on “IE6重复文字bug完美解决方案集合”

Comments are closed.