网页设计中常见的浏览器下的bug汇总IE6中双边距Bug：发生场合：当给父元素内第一个浮动元素设置margin-left（元素float:left）或margin-right（元素float:right）时margin加倍。
解决方法：是给浮动元素加上display:inline;CSS属性；或者用padding-left代替margin-left。
原理分析：块级对象默认的display属性值是block，当设置了浮动的同时，还设置了它的外边距就会出现这种情况。
也许你会问：“为什么之后的对象和第一个对象之间就不存在双倍边距的Bug”？因为浮动都有其相对应的对象，只有相对于其父对象的浮动对象才会出现这样的问题。
第一个对象是相对父对象的，而之后对象是相对第一个对象的，所以之后对象在设置后不会出现问题。
为什么display:inline可以解决这个双边距bug，首先是inline元素或inline-block 元素是不存在双边距问题的。
然后，float:left等浮动属性可以让inline元素haslayout，会让inline元素表现得跟inline-block元素的特性一样，支持高宽，垂直margin和padding等，所以div class的所有样式可以用在这个display inline的元素上。
IE6中浮动元素3px间隔Bug：发生场合：发生在一个元素浮动，然后一个不浮动的元素自然上浮与之靠近会出现的3px的bug。
解决方法：右边元素也一起浮动；或者为右边元素添加IE6 Hack _margin-left:-3px;从而消除3px间距。
原理分析：IE6浏览器缺陷Bug。
IE6/7负margin隐藏Bug：发生场合：当给一个有hasLayout的父元素内的非hasLayout元素设置负margin时，超出父元素部分不可见。
解决方法：去掉父元素的hasLayout；或者赋hasLayout给子元素,并添加position:relative;原理分析：IE6/7独有的hasLayout产生问题。
IE6/7下margin与absolute元素重叠bug：发生场合：双栏自适应布局中，左侧元素absolute绝对定位，右侧的margin 撑开距离定位。
在IE6/7下左侧应用了absolute属性的块级元素与右边的自适应的文字内容重叠。
解决方法：把左侧块级元素更改为内联元素，比如把div更换为span。
原理分析：这是由于IE6/IE7浏览器将inline水平标签元素和block水平的标签元素没有加以区分一视同仁渲染了。
属于IE6/7浏览器渲染Bug。
IE6/7/8下auto margin居中bug：发生场合：给block元素设置margin auto无法居中解决方法：出现这种bug的原因通常是没有Doctype，然后触发了ie的quirks mode，加上Doctype声明就可以了。
在《打败IE的葵花宝典》里给出的方法是给block元素添加一个width能够解决，但根据本人亲测，加with此种方法是无效的，如果没有Doctype即使给元素添加width也无法让block元素居中。
原理分析：缺少Doctype声明。
IE8下input[button | submit] 设置margin:auto无法居中发生场合：ie8下，如果给像button这样的标签（如button input[type="button"] input[type="submit"]）设置{ display: block; margin:0 auto; }如果不设置宽度的话无法居中。
解决方法：可以给为input加上宽度原理分析：IE8浏览器Bug。
IE8百分比padding垂直margin bug：发生场合：当父元素设置了百分比的padding，子元素有垂直的margin的时候，就好像父元素被设置了margin一样。
解决方法：给父元素加一个overflow:hidden/auto。
原理分析：IE8浏览器Bug。
IE bug汇总1、IE6怪异解析之padding与border算入宽高原因：未加文档声明造成非盒模型解析解决方法：加入文档声明<!doctype html>2、IE6在块元素、左右浮动、设定marin时造成margin双倍（双边距）解决方法：display:inline3、以下三种其实是同一种bug，其实也不算是个bug，举个例子：父标签高度20，子标签11，垂直居中，20-11=9，9要分给文字的上面与下面，怎么分？IE6就会与其它的不同，所以，尽量避免。
1）字体大小为奇数之边框高度少1px解决方法：字体大小设置为偶数或line-height为偶数2）line-height，文本垂直居中差1px解决方法：padding-top代替line-height居中，或line-height加1或减13）与父标签的宽度的奇偶不同的居中造成1px的偏离解决方法：如果父标签是奇数宽度，则子标签也用奇数宽度;如果是父标签偶数宽度，则子标签也用偶数宽度4、内部盒模型超出父级时，父级被撑大解决方法：父标签使用overflow:hidden5、line-height默认行高bug解决方法：line-height设值6、行标签之间会有一小段空白解决方法：float或结构并排(可读性差，不建议)7、标签高度无法小于19px解决方法：overflow: hidden;8、左浮元素margin-bottom失效解决方法：显示设置高度 or 父标签设置_padding-bottom代替子标签的margin-bottom or 再放个标签让父标签浮动，子标签margin- bottom，即(margin-bottom与float不同时作用于一个标签)9、img于块元素中，底边多出空白解决方法：父级设置overflow: hidden; 或 img { display: block; } 或_margin: -5px;10、li之间会有间距解决方法：float: left;11、块元素中有文字及右浮动的行元素，行元素换行解决方法：将行元素置于块元素内的文字前12、position下的left，bottom错位解决方法：为父级(relative层)设置宽高或添加*zoom:113、子级中有设置position，则父级overflow失效解决方法：为父级设置position:relative以下是补充：上面要先看1、终极方法：条件注释<!--[if lte IE 6]> 这段文字仅显示在 IE6及IE6以下版本。
<![endif]--> <!--[if gte IE 6]> 这段文字仅显示在 IE6及IE6以上版本。
<![endif]--> <!--[if gt IE 6]> 这段文字仅显示在 IE6以上版本（不包含IE6）。
<![endif]--><!--[if IE 5.5]> 这段文字仅显示在 IE5.5。
<![endif]--><!--在 IE6及IE6以下版本中加载css--><!--[if lte IE 6]> <link type="text/css" rel="stylesheet" href="css/ie6.css" mce_href="css/ie6.css" /><![endif]--> 缺点是在IE浏览器下可能会增加额外的HTTP请求数。
2、CSS选择器区分IE6不支持子选择器；先针对IE6使用常规申明CSS选择器，然后再用子选择器针对IE7+及其他浏览器。
代码如下:/* IE6 专用 */.content {color:red;}/* 其他浏览器 */div>p .content {color:blue;} -->3、PNG半透明图片的问题虽然可以通过JS等方式解决，但依然存在载入速度等问题，所以，这个在设计上能避免还是尽量避免为好。
以达到网站最大优化。
4、IE6下的圆角IE6不支持CSS3的圆角属性，性价比最高的解决方法就是用图片圆角来替代，或者放弃IE6的圆角。
5、IE6背景闪烁如果你给链接、按钮用CSS sprites作为背景，你可能会发现在IE6下会有背景图闪烁的现象。
造成这个的原因是由于IE6没有将背景图缓存，每次触发hover的时候都会重新加载，可以用JavaScript设置IE6缓存这些图片：代码如下:document.execCommand("BackgroundImageCache",false,true);6、最小高度IE6 不支持min-height属性，但它却认为height就是最小高度。
解决方法：使用ie6不支持但其余浏览器支持的属性!important。
代码如下:#container {min-height:200px; height:auto !important; height:200px;}7、最大高度代码如下://直接使用ID来改变元素的最大高度var container = document.getElementById('container');container.style.height = (container.scrollHeight > 199) ? "200px" : "auto";//写成函数来运行function setMaxHeight(elementId, height){var container = document.getElementById(elementId);container.style.height = (container.scrollHeight > (height - 1)) ? height + "px" : "auto";}//函数示例setMaxHeight('container1', 200);setMaxHeight('container2', 500);8、100% 高度在IE6下，如果要给元素定义100%高度，必须要明确定义它的父级元素的高度，如果你需要给元素定义满屏的高度，就得先给html和body定义height:100%;。
9、最小宽度同max-height和max-width一样，IE6也不支持min-width。