浏览器中常见的兼容性问题

1. 双倍边距问题

问题：IE6中使用了float的情况下，无论是left还是right，都会出现双倍编剧的问题；

解决方法：设置display：inline

2. 文字大小不兼容

问题：文字本身的大小不兼容。同样是font-size：14px的宋体文字，在不同浏览器下占的空间不一样，在IE下实际占14px，下留白3px；在fireFox下实际占高17px，上留白1px，下留白3px；Opera下就更不一样了。

解决方法：给文字设定line-height，确保所有文字都有默认的line-height值。这一点很重要，在高度上不能有1px的差异。

3. 高度限定失效，内容被撑大

问题：在FireFox下容器高度限定，即容器定义了height之后，容器边框的外形就确定了，不会被内容撑大，而IE下会被内容撑大，高度限定失效。

解决方法：不要轻易给容器定义height。

4. 横向上的内容被撑破问题

问题：如果float容器未定义容器宽度，在FireFox下，内容会尽可能撑开宽度，IE下则会优先考虑内容折行。

解决方法：内容可能撑破的浮动容器需要定义width。

5. 浮动问题

问题：浮动

解决方法：在Firefox下必须清除浮动。

6. mirrormargin Bug

问题：当外层元素内有float元素时，外层元素如定义margin-top：14px，将自动生成margin-bottom：14px。padding也会出现类似的问题，这都是IE6下的特产。

解决方法：外层元素设定border或者float