IE下css bug集合-翻译自haslayout.net
概述
IE浏览器以不支持大量的css 属性出名，同时也因其支持的css属性中存在大量bug。
本页列举了IE下的一些问题，实例样本和一些我们已知的解决方法。
尽管我已经尽力按照它们本来的性质对它们进行分类，仍有许多bug可以分在好几个部分之下，这种情况下，我将会将此bug分在普通bug这一部分。
统计
目前为止。本站点包含46个”普通bug”教程，5个”haslayout bug”教程，6个”不支持的方法”教程，一个“冲突bug”教程。总共58个教程，70个解决方法。
最近的教程发布于2009年8月19日 15:38:47 星期三
站点包含44个IE6 bug，28个IE7 bug以及19个IE8 bug。
注意版本
在教程中你会看到诸如“影响：IE8和所有以下”或“修复：所有版本”。这里的“所有”意思是IE6，IE7和IE8。 IE5和IE5.5已经是历史了，本网站没有考虑这些版本的教程和解决方案的。
普通bug
此部分包含的是那些不能快速定位为其他部分或是可以同时归类到两部分或更多部分的bug。
普通IE css bug
| bug名称 | 影响版本 | 描述 |
|---|---|---|
| Image Label Focus Bug | IE8,IE7,IE6 | <img>元素在<label>元素之内，单击时，焦点不会转移到相应的表单控件 |
| 按钮Margin-Auto非居中 | IE8 | Button或类似元素并不居中当{ display: block; margin-left: auto; margin-right: auto;}作用与它 时候且“宽”是不明确的 |
| 不正确的浮动收缩-包裹bug | IE7,IE6 | 一个浮动元素（设置了clear属性）在另一个浮动元素之后时不能正确的收缩-包裹 |
| overflow滚动条的不一致 | IE7,IE6 | 非常规的在<html>元素上设置overflow属性可能会出现关于<body>元素的overflow bug |
| 浮动挤压怪异差距bug | IE7,IE6 | 倒数第一个和倒数第二个浮动元素的间距似乎垂直堆叠了 |
| 浮动复制最后一个字符bug | IE7,IE6 | 浮动元素的最后一个字符被复制 |
| 空元素高度bug | IE7,IE6 | 有”layout”属性的空元素获得高度 |
| 表单控件的双边距bug | IE7,IE6 | <input>和<textarea>元素上的水平margin“继承”于含有margin和layout属性的祖先 |
| IE7 1像素点边框表现为虚线边框 | IE7 | 当至少有1边的变宽宽度大于1像素时，1像素的点边框表现为虚线边框 |
| Relative Overflow失效的bug | IE7,IE6 | 含有overflow（hidden或auto）属性的元素的后辈如果含有position:relative属性，则其表现得就像是设置为visible属性一样 |
| IE7 :hover“阻断”于absolute的bug | IE7 | 当绝对定位的子元素隐藏不可见的时候，使用:hover改变其left/top值貌似是不管用的。如果其可见，left/top也不会因:hover而改变 |
| Button按钮 :active时背景改变bug | IE8 | 当:active状态应用与<button>或<input type=”submit” />时背景会向上像左移动 |
| 忽略:focus的bug | IE8 | 当一个包含:focus的选择器在另外一个简单的选择器之后，:focus是被忽略的。 |
| 看不见的hover边框bug | IE8 | 当设置了outline，在:hover状态下，下边框要么没有完全显示，要么短了1像素（或是取消了outline） |
| Padding/margin百分比bug | IE8 | 与百分比垂直padding特定组合，垂直margin间距似乎会出岔子，在父级的父级设置了padding或border的亦会如此 |
| 图片浮动项目符号混乱bug | IE8 | 在项目列表中含有浮动属性的图片的时候，项目标记（或编号）位置不正确或是压根没有渲染出来 |
| TH标签text-align不继承的bug | IE8 | 祖辈的text-align值不会被TH元素继承下来 |
| 样式文件32的数目限制bug | IE8,IE7,IE6 | 第32个及其以后的样式文件中的样式一概忽略(i.e. <style>, <link> 或 @import) |
| 白色背景hover无效bug | IE7 | 背景hover后转为白色背景无效 |
| IE7子选择器注释bug | IE7 | 一个选择器如果包含子选择器，且在注释之后，是被忽略的 |
| 星号 HTML bug | IE6 | * html选择器在IE6下不会被无视 |
| IE6 !important忽略bug | IE6 | 如果相当的规则再设置一次，则!important关键字将会被忽略 |
| PNG图片和背景色的不匹配 | IE8,IE7,IE6 | 尽管有相同的颜色代码，但是css中的指定的颜色与png图片是有差异的 |
| Auto Margin不居中的伪bug | IE8,IE7,IE6 | block属性元素设置了两侧的margin auto不居中显示 |
| :first-line!important规则无效bug | IE8 | 当使用了!important修饰语后，:first-line内部的伪class完全不起作用 |
| :first-letter无效bug | IE6 | 全部的:first-letter规则集无效 |
| :first-letter!important无效bug | IE8 | 当使用了!important修饰语后，:first-letter内部的伪class完全不起作用 |
| 部分可点击bug | IE6,IE7 | 只有文字是可点击的/有反应的，非得把鼠标移到真正的文字上才能有:hover反应，链接失效 |
| 楼梯bug | IE6,IE7 | 浮动元素像梯子一样一个一个堆砌 |
| 列表背景消失bug | IE6 | <li>, <dt>, <dd>背景消失 |
| noscript幽灵bug | IE8,IE7,IE6 | 脚本启用的时<noscript>元素显示，仅border/background从中显示 |
| 透明无法点击的bug | IE8,IE7,IE6 | 使用了filter滤镜修复png背景透明问题的时候背景图片的透明区域链接无法点击 |
| 列表内容下沉bug | IE8 | <li>里面的内容在项目列表编号的下面 |
| <ol>数值不增加bug | IE7,IE6 | <ol>中显示的数目不随着<li>增加 |
| <ol><ul>无编号bug | IE7,IE6 | 项目编号/数值从<ol><ul>元素那儿消失了 |
| line-height图片不垂直居中的bug | IE7,IE6 | 使用line-height方法，图片不垂直居中 |
| 没有背景图片bug | IE8,IE7,IE6 | IE下使用了background背景图片，但是背景图片不显示（使用background缩写属性） |
| 自定义光标bug | IE8,IE7,IE6 | 自定义光标在IE下不显示 |
| 背景泄露bug | IE6 | 背景溢出到跟随其后的其他元素上去了 |
| 高度撑开的bug | IE6 | 元素的高度比指定的高度要长 |
| 宽度撑开的bug | IE6 | 元素的宽度比指定的宽度要宽 |
| 双边距bug | IE6 | 左边距或右边距在浮动元素上双倍 |
| 负margin bug | IE7,IE6 | 当使用负margin时，容器之外的部分元素不可见 |
| 斜体字浮动bug | IE6 | 元素含有斜体字在浮动元素后文字下沉 |
| 3px空白bug又称文本慢跑bug | IE6 | 靠近浮动元素的元素要么有3px的间距，要么位置偏下，或是保持偏移当几个元素依次浮动时 |
| Text-Align bug | IE7,IE6 | text-align属性影响block性质的元素 |
Haslayout bug
有haslayout或没有haslayout导致的IE bug
haslayout IE css bug
| bug名称 | 影响版本 | 描述 |
|---|---|---|
| 令人害怕的浮动bug | IE7,IE6 | haslayout的元素自动清除浮动代替包围浮动元素 |
| 边框混乱bug | IE6 | 边框显示混乱。例如在不该的地方显示或丢失 |
| hover bug | IE6 | 选择器例如a:hover foo{}不起作用 |
| 部分点击bug | IE6 | 样式为display:block<a>链接仅文字部分是可点击的，事实上在标准浏览器下还有额外的区域可点击 |
| 内容消失bug | IE6 | 一些内容在页面滚动或浏览器最大化最小化的时候消失或重现 |
不支持的方法
各种各样的方法提供的属性效果和属性值在IE下是不执行的
不支持的方法
| bug名称 | 影响版本 | 描述 |
|---|---|---|
| 不支持子选择器方法 | IE6 | 子选择器无效 |
| Max-width方法 | IE6 | max-width不支持 |
| Max-height方法 | IE6 | max-height不支持 |
| opacity | IE8,IE7,IE6 | 透明度opacity不支持 |
| Min-width | IE6 | min-width不支持 |
| Min-height | IE6 | min-height不支持 |
IE下css bug集合-翻译自haslayout.net的更多相关文章
- CSS之IE浏览器的hasLayout，IE低版本的bug根源
什么是hasLayout? hasLayout是IE特有的一个属性.很多的ie下的css bug都与其息息相关.在ie中,一个元素要么自己对自身的内容进行计算大小和组织,要么依赖于父元素来计算尺寸和组 ...
- 认识hasLayout——IE浏览器css bug的一大罪恶根源
原文地址:http://neverned.blog.163.com/blog/static/1265524200933021130561/ 什么是hasLayout?hasLayout是IE特有 ...
- 认识hasLayout——IE浏览器css bug的一大罪恶根源 （转）
认识hasLayout--IE浏览器css bug的一大罪恶根源 转 什么是hasLayout?hasLayout是IE特有的一个属性.很多的ie下的css bug都与其息息相关.在ie中,一个元素要 ...
- 打败 IE 的葵花宝典：CSS Bug Table
博主说:本博客文章来源包括转载,翻译,原创,且在文章内均有标明.鼓励原创,支持创作共享,请勿用于商业用途,转载请注明文章链接.本文链接:http://www.kein.pw/?p=35 原文发表于:A ...
- ie6,ie7,ie8 css bug兼容解决方法
IE浏览器以不支持大量的css 属性出名,同时也因其支持的css属性中存在大量bug. 这里收集了好多的bug以及其解决的办法,都在这个文章里面记录下来了!希望以后解决类似问题的时候能够快速解决,也希 ...
- ie6,ie7,ie8 css bug兼容解决记录
ie6,ie7,ie8 css bug兼容解决记录 转载自:ie6,ie7,ie8 css bug兼容解决记录 - 前端开发 断断续续的在开发过程中收集了好多的bug以及其解决的办法,都在这个文章里面 ...
- IE CSS Bug 系列
1.[IE CSS Bug系列]IE6&IE7图片链接无效 <!doctype html> <html> <head> <meta charset=& ...
- IE下的bug
断断续续的在开发过程中收集了好多的bug以及其解决的办法,都在这个文章里面记录下来了!希望以后解决类似问题的时候能够快速解决 ,也希望大家能在留言里面跟进自己发现的ie6 7 8bug和解决办法! 1 ...
- ie6,ie7,ie8 css bug汇总以及兼容解决方法
1:li边距“无故”增加 任何事情都是有原因的,li边距也不例外. 先描述一下具体状况:有些时候li边距会突然增 加很多,值也不固定(只在IE6/IE7有这种现象),让人摸不着头脑,仔细“研究”发现是 ...
随机推荐
- 【刷题】BZOJ 3653 谈笑风生
Description 设T 为一棵有根树,我们做如下的定义: ? 设a和b为T 中的两个不同节点.如果a是b的祖先,那么称"a比b不知道 高明到哪里去了". ? 设a 和 b 为 ...
- 01-go语言开始-HelloWorld
以输出HelloWorld为目标 Go的发展史 Go语言诞生(2007年的谷歌)的背景是由于软件开发的新挑战: 多核硬件架构 超大规模分布式计算集群 Web模式导致的前所未有的开发规模和更新速度 Go ...
- (转)eclipse 报错 ：The method list(String, Object[]) is ambiguous for the type BaseHibernateDao
背景:在开发过程中,经常遇到各种各样的编译问题,不断的总结,才能更好的提高效率. 描述 [报错] :The method list(String, Object[]) is ambiguous for ...
- Java 使用 Enum 实现单例模式
在这篇文章中介绍了单例模式有五种写法:懒汉.饿汉.双重检验锁.静态内部类.枚举.如果涉及到反序列化创建对象时推荐使用枚举的方式来实现单例,因为Enum能防止反序列化时重新创建新的对象.本文介绍 Enu ...
- 使用pandas导入csv文件到MySQL
之前尝试过用命令行来解决csv文件导入到MySQL这个问题,没想到一直没有成功.之后会继续更新的吧,现在先用pandas来解决这个问题,虽然会复杂一点,但至少能用. 例子是导入movielens的ra ...
- Java与groovy混编 —— 一种兼顾接口清晰和实现敏捷的开发方式
有大量平均水平左右的"工人"可被选择.参与进来 -- 这意味着好招人 有成熟的.大量的程序库可供选择 -- 这意味着大多数项目都是既有程序库的拼装,标准化程度高而定制化场景少 开发 ...
- Java 在匿名内部函数中为外部函数变量赋值的解决方案
Java匿名内部函数本人不怎么主动使用,但是经常会调用一些API,其中会调用一些接口,而这些接口是需要使用匿名内部类来实现的,于是就遇到了一些问题. 就比如okHttp3 的接口调用 OkHttpCl ...
- OpenResty 扩展库(二)lua-resty-template
Lua和OpenResty的模板引擎(HTML) 模板语法 您可以在模板中使用以下标签: {{expression}},写入表达式的结果 - html转义 {*expression*},写入表达结果 ...
- 把jQuery的类、插件封装成seajs的模块的方法
这篇文章主要介绍了把jQuery的类.插件封装成seajs的模块的方法,需要的朋友可以参考下 注:本文使用的seajs版本是2.1.1 一.把Jquery封装成seajs的模块 define(func ...
- UVALive 6176 Faulhaber's Triangle
题目链接 http://acm.sdibt.edu.cn/vjudge/ojFiles/uvalive/pdf/61/6177.pdf 题意是 给定一个数n,代表着一共有n个人,且他们的身高从1到n ...