五:文字溢出bug(注释bug)

1、在以下情况下将会引起文字溢出bug

  1. 一个容器包含2两个具有“float”样式的子容器。

  2. 第二个容器的宽度大于父容器的宽度,或者父容器宽度减去第二个容器宽度的值小于3
  3. 在第二个容器前存在注释(这也是为什么此bug也叫做“IE6注释bug”的原因)。

2、引起bug时的效果图

这是正常效果

IE6下却多了一个“怪”字,真是怪

3、修复该bug的解决方案

  1. 改变结构,不出现【一个容器包含2两个具有“float”样式的子容器】的结构。——此解决方案的评论:疯了!因噎废食的做法。
  2. 减小第二个容器的宽度,使父容器宽度减去第二个容器宽度的值大于3,例如将本文示例中第二个子容器的宽度改为197px.——此解决方案的评论:在满足页面布局的前提下可以使用。但是当情况比较复杂的时候,可能实施起来比较困难。
  3. 去掉所有的注释。——此解决方案的评论:最直接的做法,但是“没有注释的代码”,的确不是一个好的代码写作习惯。
  4. 修正注释的写法。将 写成——此解决方案的评论:还不错的解决方案,但是并不是每个人都对这种注释写法很欣赏。
  5. 在第二个容器后面加一个或者多个

六、 宽度100%问题

 本来自信的我一般不会去用IE6测试自己写的网页,但今天在整理自己的博客时,无意间用IETester测试了一下自己的博客,结果很是令我吃惊,很多页面在IE6上虽然没有太大的bug,但很多却变得很难看,于是就开始改各种bug了。其他一些字体啊,颜色啊都很好改,花了几分钟就搞定,但其中有一个问题很让我摸不着头脑,简单的说是IE6下宽度100%会出问题。下面我用代码和截图来模拟这个问题的场景:
<div style=" float:left; width:140px; height:200px; background-color:#EBB9FB; padding:10px">我是左浮的div</div>
<div style="background-color:#CCCCCC; border:#CC9933 solid 1px; margin-left:170px">
<table border="0" cellpadding="0" cellspacing="0" style="width:100%;">
<thead>
<tr style="background-color:#00CCCC">
<td>姓名</td>
<td>年龄</td>
<td>大学</td>
<td>性别</td>
</tr>
</thead>
<tbody>
<tr>
<td>大傻</td>
<td>33</td>
<td>浙江大学</td>
<td>男</td>
</tr>
<tr>
<td>二傻</td>
<td>32</td>
<td>中国计量学院</td>
<td>男</td>
</tr>
</tbody>
</table>
</div>

正常的效果图应该是这样的:

但在IE6上表格上面却多出了很大一段空白:

解决办法有两个:

  1. 宽度不要设成100%,设成99%即可。
  2. 如果宽度一定要100%,则可在表格外面的div中加上样式 _height:1% 就可以解决问题。

悲催的IE6 七宗罪大吐槽(带解决方法)第三部分的更多相关文章

  1. 悲催的IE6 七宗罪大吐槽(带解决方法)第一部分

    一.奇数宽高 悲剧的IE6啊,为何有如此多bug,但用户市场又那么大,真让我们搞网站的纠结.今天就遇到了一个非常奇怪但又很细节的一个bug,一个外部的相对定位div,内部一个绝对定位的div(righ ...

  2. 悲催的IE6 七宗罪大吐槽(带解决方法)第二部分

    三.position:fixed无效 今天在IE6上遇到一个bug,本来想做一个消息提示框,让他在页面右上角停留一段时间后消失,这段时间内提示框随着页面的下拉一直出现在浏览器可见区的顶部,于是我用到了 ...

  3. ie6 z-index不起作用的解决方法

    一.概念 z-index伴随着层的概念产生的.网页中,层的概念与photoshop或是flash中层的概念是一致的.熟悉photoshop或是flash的应该知道,层级越高(图层越靠上),越在上面显示 ...

  4. ie6,ie7,ie8 css bug兼容解决方法

    IE浏览器以不支持大量的css 属性出名,同时也因其支持的css属性中存在大量bug. 这里收集了好多的bug以及其解决的办法,都在这个文章里面记录下来了!希望以后解决类似问题的时候能够快速解决,也希 ...

  5. 【转】 IE6 IE7 IE8 css bug兼容性解决方法总结归纳

    1:li边距“无故”增加 任何事情都是有原因的,li边距也不例外. 先描述一下具体状况:有些时候li边距会突然增 加很多,值也不固定(只在IE6/IE7有这种现象),让人摸不着头脑,仔细“研究”发现是 ...

  6. 【转】Windows2008上传大文件的解决方法(iis7解决上传大容量文件)

    2008上传大文件的解决方法:http://wenku.it168.com/d_000091739.shtml 2003上传大文件的解决方法:http://tech.v01.cn/windowsxit ...

  7. .NET MVC Json()处理大数据异常解决方法

    [1-部分原文]: .NET MVC Json()处理大数据异常解决方法 整个项目采用微软的ASP.NET MVC3进行开发,前端显示采用EasyUI框架,图表的显示用的是Highcharts,主要进 ...

  8. windows mysql 中文乱码和中文录入提示太大错误的解决方法

    今天操作mysql的时候很郁闷,因为修改默认字符集搞了半天,终于弄成了(关于如何把windows的默认字符集设置成功,可以参看另一篇博文,最终在mysql中输入show variables like ...

  9. .net core IIS/Kestrel上传大文件的解决方法

    大文件,就是内容的大小超过了一定数量的文件,比如1个GB的文件. 站点一般会限制上传文件的大小,如果超过了一定限制,则会报错误. 在处理大文件上传的方式上,IIS代理和Kestrel宿主服务器的处理方 ...

随机推荐

  1. PROFIBUS-DP现场总线的结构及应用

    PROFIBUS的最大优点在于具有稳定的国际标准EN50170作保证,并经实际应用验证具有普遍性.目前已广泛应用于制造业自动化.流程工业自动化和楼宇.交通电力等领域. PROFIBUS由3个兼容部分组 ...

  2. Intellij IDEA中file size exceeds configured limit解决

    把Hadoop源码导入IDEA中后,其中有个ClientNamenodeProtocolProtos文件代码高达82997行,IDEA直接就不把它当java类看了,报file size exceeds ...

  3. 订制EditText光标

    订制EditText光标 设置背景android:background="@null" 设置光标样式:android:textCursorDrawable="@drawa ...

  4. lr几个常用的函数

    将字符串保存为参数 lr_save_string("string you want to save", "arg_name"); 将int型数字保存为参数 lr ...

  5. zoj 2588 Burning Bridges(割边/桥)

    题目链接:http://acm.zju.edu.cn/onlinejudge/showProblem.do?problemId=1588 题意:Ferry王国有n个岛,m座桥,每个岛都可以互达,现在要 ...

  6. python利用unittest测试框架组织测试用例的5种方法

    利用unittest测试框架可以编写测试用例,执行方式分两大类:利用main方法和利用testsuite,其中利用测试套件来组织测试用例可以有4种写法. 在此之前,先了解几个概念 TestCase:所 ...

  7. 【刷题】洛谷 P3768 简单的数学题

    题目描述 由于出题人懒得写背景了,题目还是简单一点好. 输入一个整数n和一个整数p,你需要求出(\(\sum_{i=1}^n\sum_{j=1}^n ijgcd(i,j))~mod~p\),其中gcd ...

  8. BZOJ 4316: 小C的独立集 解题报告

    4316: 小C的独立集 Description 图论小王子小C经常虐菜,特别是在图论方面,经常把小D虐得很惨很惨. 这不,小C让小D去求一个无向图的最大独立集,通俗地讲就是:在无向图中选出若干个点, ...

  9. springboot项目添加jsp支持

    一.创建springboot项目 使用 http://start.spring.io/ 快速创建一个springboot项目下载并导入 二.添加依赖 在pom.xml中添加支持jsp的依赖如下: &l ...

  10. bzoj 2300 : [HAOI2011]防线修建

    set动态维护凸包 #include<iostream> #include<cstdio> #include<cstring> #include<algori ...