关于IE和火狐浏览器样式不兼容的一些总结
什么是浏览器兼容：当我们使用不同的浏览器（Firefox IE7 IE6）访问同一个网站，或者页面的时候，会出现一些不兼容的问题，有的显示出来正常，有的显示出来不正常，我们在编写CSS的时候会很恼火，刚修复了这个浏览器的问题，结果另外一个浏览器却出了新问题。而兼容就是一种办法，能让你在一个CSS里面独立的写支持不同浏览器的样式。
1. cursor: pointer 可以同时在 IE、 FF 中显示游标手指状， hand 仅 IE 可以
2. CSS+DIV的兼容性问题
在网站设计的时候，应该注意css样式兼容不同浏览器问题，特别是对完全使用DIVCSS设计的网，就应该更注意IE6IE7FF对CSS样式的兼容，不然，你的网可能出去不想出现的效果！
所有浏览器通用height:100px;
IE6专用_height:100px;
IE6专用*height:100px;
IE7专用*+height:100px;
IE7、FF 共用 height: 100px !important;3. FF下给 div 设置 padding 后会导致 width 和 height 增加, 但IE不会.(可用!important解决)
margin加倍的问题。
设置为float的div在ie下设置的margin会加倍。这是一个ie6都存在的bug。
解决方案是在这个div里面加上display:inline;
例如：
<#divid=\”imfloat\”>
相应的css为
#IamFloat{
float:left;
margin:5px;/*IE下理解为10px*/
display:inline;/*IE下再理解为5px*/}
4、最狠的手段 -!important;
如果实在没有办法解决一些细节问题,可以用这个方法.FF对于”!important”会自动优先解析,然而IE则会忽略.如下.tabd1{
background:url(/res/images/up/tab1.gif)no-repeat0px0px!important;/*StyleforFF*/
background:url(/res/images/up/tab1.gif)no-repeat1px0px;/*StyleforIE*/}
值得注意的是，一定要将xxxx !important 这句放置在另一句之上；5、兼容代码:兼容最推荐的模式。
/*FF*/
.submitbutton{
float:left;
width:40px;
height:57px;
margin-top:24px;
margin-right:12px;
}
/*IE6*/
*html.submitbutton{
margin-top:21px;
}
/*IE7*/
*+html.submitbutton{
margin-top:21px;
}
6.浮动ie产生的双倍距离
#box{float:left;width:100px;margin:000100px;//这种情况之下IE会产生200px的距离display:inline;//使浮动忽略}
这里细说一下block,inline两个元素,Block元素的特点是:总是在新行上开始,高度,宽度,行高,边距都可以控制(块元素);Inline元素的特点是:和其他元素在同一行上,…不可控制(内嵌元素);
#box{display:block;//可以为内嵌元素模拟为块元素display:inline;//实现同一行排列的的效果Diplay:table;
7. IE6的双倍边距BUG<style type="text/css">
body{margin:0}
div{float:left;margin-left:10px;width:200px;height:200px;border:1pxsolidred}
</style>浮动后本来外边距10px,但IE解释为20px,解决办法是加上display:inline
8. firefox嵌套div标签的居中问题的解决方法
假定有如下情况：
<divid="a">
<divid="b"></div>
</div>如果要实现b在a中居中放置，一般只需用CSS设置a的text-align属性为center。这样的方法在IE里看起来一切 正常；但是在Firefox中b却会是居左的。
解决办法就是设置b的横向margin为auto。例如设置b的CSS样式为：margin:0 auto;。