DIV 定位所不為人知的問題（跨平台）

在過去的網頁設計上，事實上我很少使用CSS的東西，也很少宣告Style，因為我覺得「文以載道」，網頁應該還是要保有BBS的概念，內涵比外表重要。

但是，最近接了個專案，因為有定位的問題，內容必須與底圖的位置配合，因此只好借重「DIV」這個「區塊指令」，簡單的說，他用
＜div＞ ＜/div＞ 來包覆一個區塊的文字或是內容，而這個區塊可以透過
＜div＞ 裡面的 Style 宣告，給予一個定義。

例如：

＜div style="position: relative;"＞ 是宣告這個區塊的位置，是採用相對的關係。
＜div style="position: absolute;"＞
則是宣告這個區塊的位置，是採用絕對的關係。
一般來說，position 的宣告有四種：

position: static; 靜態
position: relative; 相對
position: absolute; 絕對
position: fixed; 固定

相關的定義請各位看倌另外爬文，我這裡想要說的是在不同平台上的寫法，我原先主要是針對 Chrome 及 Safari ，我要在一個底圖上，某個固定位置鑲上另外一個圖，許多文章、書本都說這樣寫就可以：
＜div style="position: relative;"＞
＜img border="0" src="fig1.jpg width=1200"＞
　　＜div id="test" style="display: block; left: 500 px; position: absolute; top: 200 px;"＞
　　＜img border="0" src="fig2.jpg" width="100"＞
　　＜/div＞
＜/div＞

 事實上寫好之後，在IE 、 Chrome 及 Safari 看起來也都正常，顯示狀況不錯。

可是，當我用 Firefox, Opera 看的時候，可就天差地！第二張圖完全不在想要的位置上，怎麼回事呢？重新爬文了半天，也看不到相關的說明。

就在不知所措的時候，看到另一個範例寫著：

left:500px; top:200px;

看到沒有，500與px之間沒有空格！

這，真的是問題的關鍵嗎？

沒錯，當我把空格取消之後，這個頁面的顯示就能跨平台了！