<!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;">IE6多出一只猪bug</div> <!-- --> <!-- --> <div style="float:right;width:400px; border:1px solid red;">↓猪随注释个数递增,这就是多出来的那只猪</div> </div> </body> </html>
1、在IE、FF中测试,只在IE出现文字溢出现象。
说明:注释造成文字溢出是IE的BUG。
2、去除<div
style="float:left"></div>
中的“float:left;”,你会发现多出来的“猪”字不见了,页面正常显示。
3、同样去除 <div style="float:right;width:400px">中的“float:right;”,多余的“猪”字也同样消失,页面正常显示。
4、将注释转移到浮动块内,多余的“猪”字消失,页面正常显示。
5、去除文字区块的固定宽度。
<!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;">IE6多出一只猪bug</div> <!-- --><!--
--><div style="float:right;width:400px; border:1px solid
red;">↓猪随注释个数递增,
这就是多出来的那只猪</div></div></body></html>
原文:http://www.cnblogs.com/stephenykk/p/3578196.html