现在浏览器世界，什么都在升级，兼容性越来越好，布局出来的效果也很炫，可是有时候我们又不得不抱怨，有很多的人就像博物馆里的古董一样，不喜欢改旧换新，一直沿用着老版本的浏览器，给我们程序员带来了很大的麻烦，麻烦的不是他们换浏览器，而是浏览器里的BUG，让我们很头疼，这不，我现在就遇到了好多的问题，在火狐、苹果、谷歌等浏览器都目测正常，到了IE，哇呀。。。。惨目忍睹，怎么这样了呀，其他浏览器不是好好的吗？好吧，微软的比较特殊，不想改，但又不得不改，市场占有率IE仍然是龙头老大呀，必须考虑一下它的感受，改吧！以下是常见的IE bug:
bug1、居中问题
css代码：
#main{ margin:0 auto; width:980px; height:500px; background:#f00;} HTML代码：
document title
就是这样的代码，在如今主流浏览器都测试通过，以及IE6.0以上版本的浏览器也可以正常通过，可是一到了IE6.0及IE6.0以下版本，哇呀，都靠右了，怎么弄都不好使。怎么办呢？解决办法有二：
方法一、加入DTD文档头，代码如下：
加了上面这段，则浏览器会根据W3C的标准去解释和渲染，解决了IE中不居中的问题。
方法二、在body的css样式中加入下面代码：
body{ text-align:center;} 加入以上代码，则在IE6.0以下版本都会将body体里的内容全部居中。
bug2、双倍margin问题
问题描述：元素设置float后，不管是左浮动还是右浮动，margin边距是定义数值的两倍。
CSS代码如下：
#main{ float:left; margin-left:30px; width:400px; height:400px; background:#eee;} 期望的结果是离左边的边距是30px;而在IE6.0版本以下的的结果却出现了60px。
解决办法：
在CSS样式表中加入代码：
_display:inline;
以上这段代码只有IE版本的浏览器才能识别，这样就解决了双倍margin的问题，也不影响其他浏览器上的显示效果。
bug3、子DIV设置浮动后，父DIV自适就高度失效。
解决办法有以下三种，常用的有以下两种。
(1)设置父DIV的CSS代码为如下：
#main{ overflow: hidden; zoom:1;} (2)设置父DIV的CSS代码如下：
#main{ clear:both;} (2)新增一个子DIV并设置该DIV的CSS代码为如下：
#main{ clear:both; overflow:hidden; width:0px; height:0px;} 4、设置min-height和min-width，IE忽略了min-height。
解决办法：
（1）这个fix由 Dustin Diaz提供。其利用了 !important 下面是代码片段，我是从网上截取下来的，具体还没遇到过：
css代码如下：
#main { min-height:150px; height:auto !important; height:150px;} （2）代码如下
#main { min-height: 150px; height: 150px;}html>body #main { height: auto; } 5、Fixing the Broken Box Model
IE曲解了“盒子模子”可能是最不可原谅的事情了。IE 6 这个半标准的浏览器回避了这个事情，但这个问题还是会因为IE运行在“怪异模式”下出现。
两个Div元件。一个是有fix的，一个是没有的。而他们不同的高和宽加上padding的总合却是不一样的。解决办法：
#main{ width:400px; height:100px; padding:50px;} #main{ width: 400px; height: 150px; \height: 250px; \width: 500px} 是的，以上这段代码就是告诉浏览器你要原来的长和宽上加上了padding。但这个fix只会作用于IE了的“怪异模式”，所以你不需要担心在IE6的正常模式下会有问题。
6、3像素margin问题。
先看一下代码：
HTML代码：
div1div2
CSS代码：
主流浏览器运行效果图如下：
而IE6.0版本以下的效果图如下，出现了3像素margin:
由以上现象可以说明，3像素margin是由开发者书写不规范所造成，解决方法可以设置两DIV都为浮动就可以了，代码如下：
以上就是我工作中遇到的BUG，还有很多，只是我还没遇到，如果大家有遇到 ，请一起交流一下，如我遇到新的BUG，我会继续补充上去。
哥们些，赶快抛弃IE7以下的吧！不要再做“古董”了。。。