要保證CSS效果在IE和Firefox下兼容的話，推薦如下：

1：盡量少的使用Margin，使用padding來設(shè)置距離，margin太不穩(wěn)定了,

(當(dāng)碰到莫名其妙的時(shí)候，試試這條。將margin設(shè)為0，單獨(dú)設(shè)置padding)

---

2：如果要設(shè)置float的話，心里問下自己是否會溢出(內(nèi)容溢出)，會有什么結(jié)果中,如果有的話，

解決方案有很多種，最簡單的在后面加個(gè)<br />，設(shè)置<br />的style:display:none;clear:both;。

樓下有說先設(shè)置float:right，后設(shè)置float:left，至今不明白，能不能詳細(xì)解釋下

---

3：作為容器的div的position最好設(shè)置為relative，以作為子內(nèi)容的定位元素，如果確定設(shè)置position為absolute沒什么影響的話，也可以設(shè)置為absolute；

 

這里有一點(diǎn)是不要設(shè)置其left和top，這樣主要是為了方便內(nèi)部元素，當(dāng)我們知道內(nèi)容元素的定位元素就是它的上級元素的時(shí)候，定位也相對容易點(diǎn)，當(dāng)然了高手可以略過。

---

4：body，以及一些比較大的容器div的margin最好設(shè)置為0，padding也為0;因?yàn)閙argin在瀏覽器中兼容性是不好，主要是全局配置。

 

---

5: ul的margin要顯式的設(shè)定其值，比如：ul{margin:10px;}，不顯式指定的話，在IE和firefox下其margin會不同。

 

---

6：CSS開始布局CSS：

 

body{margin:0px;padding:0px; text-align:center}//這里做一些全局配置

#container{margin:1px auto 0px auto ; width:XXXX; text-align:left;}

//設(shè)置大div居中，注意這里的每個(gè)細(xì)節(jié)

1:margin:1px auto 0px auto;可以達(dá)到居中效果，即在IE和Firefox下居中，主要是左右的margin為auto;

2:width:xxxx;設(shè)置大div的寬度，主要作用是為了防止當(dāng)瀏覽器分辨率的變化給div造成影響，因?yàn)檫@個(gè)是根div，所以為了好布局，我固定它的寬度，大家可以看看163，xunlei,sohu,這些門戶網(wǎng)站，可以發(fā)現(xiàn)最大的那個(gè)div寬度是固定的。

3:text-align:left:設(shè)置內(nèi)容為左對齊。

 

 

 

以上只是我的一些心得體會，如果大家有什么好的建議的話可以寫在下面，這里有一點(diǎn)要求就是請說明為什么要這樣做？

 

• css
• 瀏覽器
• 兼容
• 布局