【IE6的疯狂之四】IE6文字溢出BUG
在IE6下使用浮动可能会出现文字重复的情况.
在IE6下，浮动层之间有注释文字的话，之前那个浮动层的内容文字就有可能遭遇一个“隐形”的复制，但是代码里查看文字可并没有多出来。
看个例子：
- <!DOCTYPE html PUBLIC ”-//W3C//DTD XHTML 1.0 Transitional//EN” ”http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
- <html xmlns=“http://www.w3.org/1999/xhtml”>
- <head>
- <meta http-equiv=“Content-Type” content=“text/html; charset=gb2312″ />
- <title>多了一只猪</title>
- </head>
- <body>
- <div style=“width:400px”>
- <div style=“float:left”></div>
- <!– _ –>
- <div style=“float:right;width:400px”>↓这就是多出来的那只猪</div>
- </div>
- </body>
- </html>
用IE6看一下，你会发现真的会多出一只“猪”！
问题原因以及解决方法：
原因：
由注释造成文字溢出，属于IE6的BUG，溢出文字的字数=注释的条数*2-1，这里的字数在中文或英文数字时都成立。注释坐在位置与溢出位置、区块的浮动以及文字区块的固定宽度有必然联系。
解决办法：
1、不放置注释。最简单、最快捷的解决方法；
2、注释不要放置于2个浮动的区块之间；
3、将文字区块包含在新的<div></div>之间，如：<div style=”float:right;width:400px”><div>↓这就是多出来的那只猪</div></div>；
4、去除文字区块的固定宽度，与3有相似之处；
5、在后面加一个<br />或者空格；（不推荐）
6、使用IE注释格式，如：<!–[if !IE]>Put your commentary in here…<![endif]–>
7、给盒子加position:relative;属性
引发这种BUG有几个条件
1、是注释引起的,删除所有注释即可.
2、hidden的input直接放在form下.
3、display为none的div也有可能引发此bug.
2、3可以通过外面再包一次DIV解决
转载请注明转自《【IE6的疯狂之四】IE6文字溢出BUG》
【IE6的疯狂之四】IE6文字溢出BUG的更多相关文章
- IE6文字溢出BUG(多出来的猪问题)
在IE6下使用浮动可能会出现文字重复的情况. 在IE6下,浮动层之间有注释文字的话,之前那个浮动层的内容文字就有可能遭遇一个“隐形”的复制,但是代码里查看文字可并没有多出来. 看个例子: HTML & ...
- 【IE6的疯狂之十三】IE6下使用滤镜后链接不能点击的BUG
大家可能都知道IE6下使用DXImageTransform.Microsoft.AlphaImageLoader滤镜(用于PNG32 Alpha透明)后链接不能点击的BUG,大家也都知道只要在a标签上 ...
- 【IE6的疯狂之十二】一个display:none引起的3像素的BUG
今天同事给我看了一个display:none引起的3像素的BUG,非常奇怪!从来没碰到过display:none还能引起这种bug. 看代码: <div style="width: ...
- 【IE6的疯狂之十一】CSS的优先级及!important在IE6下的BUG
一 css的优先级 今天有人跟我说css hack中用!important来区分ie6,因为ie6不支持!important,是的在很早以前我也是用过这种方法写hack,但是后来就基本不用了.本来我对 ...
- 【IE6的疯狂之十】父级使用padding后子元素绝对定位的BUG
在前端开发中,经常会用到css的position:absolute来使层浮动,前通过left,top,right等属性来对层进行定位,但ie6对left,top,right等属性的解释和ie7,ie8 ...
- 【IE6的疯狂之九】li在IE中底部空行的BUG
曾经写过[IE6的疯狂之六]li在IE中底部3像素的BUG(增加浮动解决问题),原文地址:http://www.css88.com/archives/421: IE6 BUG大全: http://ww ...
- 【IE6的疯狂之八】链接伪类（:hover）CSS背景图片有闪动BUG
IE6下链接伪类(:hover)CSS背景图片有闪动BUG,主要原因ie会再一次请求这张图片,或者说图片没被缓存. 例如: CSS代码 a:hover{background:url(imagepath ...
- 【IE6的疯狂之六】li在IE中底部3像素的BUG（增加浮动解决问题）
今天开发项目中碰到一个li在IE中的BUG,先来看设计原型(如图:) 两个红色中间是<li>1px的底边框: 我写的代码如下: ============================== ...
- 【IE6的疯狂之三】IE6 3像素BUG的实例
问题:2列布局.左列固定,右列液态我需要做一个布局.2列,左边列固定宽度.右边列使用剩余宽度.整体宽度不固定,这样不管在17 还是19的屏幕上,左边列始终宽度不变,右边列宽度始终占据剩余宽度.但是我写 ...
随机推荐
- 空格 在不同浏览器中显示距离不一致问题解决方法
在ie.firefox.chrome浏览器上显示的效果不太一样,主要是前面的空格宽度不同. 网上资料说不同的浏览器会有不同的默认字体,一般 IE默认字体都是宋体,而firefox和chrome的默 ...
- Android 下载模块分析(DownloadManager和DownloadProvider)
Android下载模块主要有2个部分组成:DownloadManager和DownloadProvider:其中DownloadManager提供接口供调用,具体的实现是 DownloadProvid ...
- 物理数据模型(PDM)->概念数据模型 (CDM)->面向对象模型 (OOM):适用于已经设计好数据库表结构了。
物理数据模型(PDM)->概念数据模型 (CDM)->面向对象模型 (OOM):适用于已经设计好数据库表结构了. 步骤如下: 一.反向生成物理数据模型PDM 开发环境 PowerDes ...
- 从MSSQL server 2005中移植数据到Oracle 10g
body, p, th, td, li, ul, ol, h1, h2, h3, h4, h5, h6, pre { font-family: simsun; line-height: 1.4; } ...
- WPF实现打印功能
WPF实现打印功能 在WPF 中可以通过PrintDialog 类方便的实现应用程序打印功能,本文将使用一个简单实例进行演示.首先在VS中编辑一个图形(如下图所示). 将需要打印的内容放入同一个< ...
- ASP.NET MVC4简单使用ELMAH记录系统日志
ASP.NET MVC4简单使用ELMAH记录系统日志 前言 在项目开发.测试以及已经上线的项目中都会存在bug,而如果我们在项目的各个阶段都能及时的监控系统出现的任何问题,那么对于我们开发人员来说完 ...
- BCP导入导出MsSql
BCP导入导出MsSql 1.导出数据 (1).在Sql Server Management Studio中: --导出数据到tset1.txt,并指定本地数据库的用户名和密码 --这里需要指定数据库 ...
- 【详细贴】Ubuntu Linode搭建海外策略路由VPN IPSec+L2TP（一）
对于码农来说,Google上搜索,stackoverflow上提问,twitter上交流,这样的国际化开放平台才是码农成长的空间.但是,目前遇到的一些现实的困难,无可避免的带来一些麻烦,不过这难不倒我 ...
- ok6410 u-boot-2012.04.01移植五支持DM9000
继ok6410 u-boot-2012.04.01移植四后,开发板基本已支持MLC NAND,但还有一些细节地方修改,这节增加DM9000支持,通过网卡tftp程序到内存,接着通过NAND命令写到NA ...
- zabbix 布署实践【7 H3C网络设备监控模版制作思路】
我们知道,zabbix安装后自带Template OS Linux 模版已满足了绝大部分Linux服务器的基础环境监控,只是我们在其模版上稍微修改,可配合将SWAP监控取消,另存为一个叫OS Linu ...