需要为不同浏览器设置兼容属性，火狐下可以安装Firebug检查页面代码。
您可以在火狐社区了解更多内容。希望我的回答对您有所帮助，如有疑问，欢迎继续在本平台咨询。
1. 目标不居中；一般新手都爱出现这个问题，主要原因是对盒子模型不够理解，如果发现你的页面没有居中，基本上有两种情况：
a.如果是在浏览器中没有居中，就是没盒子，就是要用一个大DIV把所有需要居中元素装起来，然后给盒子一个css样式margin:0 auto
b.如果想要盒子内的元素居中，必须定义盒子的绝对宽度,然后给盒子一个CSS样式 text-align:center
2. 目标在不同浏览器上的位置不同；
a. 首先不要去急着找hack,先看一下自己的代码有没有错误，DW里有一个“检查浏览器兼容性”功能特别实用；
b. 然后，尽量让目标的位置初始化，使之在所有浏览器都处在同一个位置，这个条件的前提 是，不写hack，最后再一个方位一个方位调整。
3. 目标与目标之间距离在各个浏览器上的区别；
a. 给其中一个目标加背景颜色；
b. 观察背景色与另外一个目标的距离，查看是不是这个目标造成的距离问题
c. 如果不是上一个目标，那就给另外一个目标也加上背景颜色。
d. 这样很容易判断出那个目标造成的原因，就针对那个目标进行修改。
4. IE6兼容问题最多的一个，浮动问题。
a. flaot浮动造成IE6下面双倍边距问题，这个最常见，也最好处理，解决方法：
只需要给这个DIV加一个样式：display:inline
b. 布局的时候经常会遇到这种情况：发现有一个DIV浮动了，接下来的一个DIV本来是要在下面显示的，结果跑上面去了，这种情况一般在FF下面会出现。
解决的办法：清除浮动，在设置过浮动的那个DIV下面加一个DIV，给个样式clear:both如下
是因为CSS Transition在ie和firefox中的兼容性不好造成的。说明如下：
在W3C官方的标准里，通过transform属性使对象旋转的写法如下： transform: rotate(40deg)/* 其中40是旋转的角度 */ 可是由于目前几乎所有的浏览器对这个属性的渲染效率都很低，所以我们可以用下面的hack去提高渲染效率： -o-transform: rotate(40deg)/* Opera浏览器 */ -webkit-transform: rotate(40deg)/* Webkit内核浏览器 */ -moz-transform: rotate(40deg)/* Firefox浏览器 */ 由于目前所有版本的IE都不兼容CSS3，所以我们只能通过IE的CSS滤镜来实现，写法如下：
filter: progid:DXImageTransform.Microsoft.Matrix(sizingMethod='auto expand',
M11=0.7660444431189777, M12=-0.6427876096865394, M21=0.6427876096865398,
M22=0.7660444431189779)"
