CSS：Hacks For IE6/IE7/FireFox

有時候我們在用CSS樣式表來製作網頁的時候，常常會發現在不同的瀏覽器裡面看到的樣子是不一樣的，最常遇到的就是IE6、IE7、FireFox之間的差異了。FireFox是採用網頁標準規範來製作的，能準確的解析出網頁標準格式；但IE6和IE7就不是這個樣子了，它們對於網頁標準的規範不如FireFox準確，而且同樣都是IE瀏覽器，不同的版本讀出來的東西竟然也不一樣！像IE6和IE7就不同，這很令人頭痛！

經過一段的測試，我無意間發現了一個方法，可以讓IE6/IE7/FF都能正常作用！只不過，這個方法可能已經有人比我早發現了！

今天我在找這個方法的時候，發現其實還是有很多網站有不同的寫法，但我認為最簡單的方法(和我用的方法一樣的…)，首先在awflasher.com的「解决IE6、IE7、Firefox兼容最简单的CSS Hack」上看到，不過他是在cmsproducer.com的Creating different CSS style selector definitions for different browsers (Firefox, Internet Explorer 7 and IE 6.0)上看到的。方法如下：

#yourDiv{
　padding:100px;
　#padding:200px;(#也可用*替換)
　_padding:300px;
}

意思是…"yourDiv"這個id，在FF(FireFox)的padding會顯示為100px的距離，在IE7是200px，在IE7版本以下(IE5、IE6)則會是300px。

換言之，FF只會讀取正確的語法，而不會讀取#或_開頭的語法；但IE7則會把#(或*)開頭的語法也讀進去，但略過_(底線)開頭的語法；IE7以下的舊版IE則會略過#開頭的語法，繼續讀取_開頭的語法。一般來說，愈後讀取的語法愈優先表示出來。

其它還有將IE7會讀取的#號換成+號或*號的，也可以去試試。

我把一些不錯的相關連結列在底下，提供參考：

• 解決IE6、IE7、Firefox兼容最簡單的CSS Hack
• CSS 處理不同瀏覽器畫面錯亂問題
• CSS Hack
• Will the browser apply the rule(s)?

心有餘而力不足

有時候，你看到某個東西是有問題的，而且你知道問題出在哪裡、應該要怎麼做；於是你告訴了對方這個問題，同時也不吝嗇的告訴對方答案、試著去解釋原因、舉出不同的例子、甚至做一次給對方看…終於，你得到了認同的表情，對方點點頭，並且表示非常同意你的方法！而且以後就會這麼做！你覺得這樣子的結果似乎不錯！

但是，過了一陣子，你卻又再次看到同樣的問題，讓你吃驚不已！

於是，你很有耐心的再解釋一次，再舉出不同的例子，再一次讓對方又給了你認同的表情，點點頭，並且表示非常同意你的看法！

過了一陣子，你還是看到同樣的問題，不過，這次得到的是「感嘆」！難道這就是「心有餘而力不足」嗎？