position:relative在css設計中有著居住輕重的作用，如果你還沒有用過它那麼真是巨大的遺憾，以前做過div title提示框的時候有個箭頭定位問題，當時的解決辦法就是多套用一層div並且留白一定大小，用來背景顯示箭頭，但是發現箭頭永遠在下面，沒有辦法遮蓋 主體融合的部分 ，所以效果也就不好，當然，聰明的您可能已經有更好的解決辦法了，用position:absloute又不能完全解決問題，每次要定位實在是一件麻煩的事情，解析度調整等等都要重新計算，也影響效能，position:relative就是一個最好的解決辦法，至於用法很簡單，網上很多，在此就不再累述。

   但是實際使用中發現一個相容性的問題，position:relative是指標對上級目錄的相對決定定位，他是浮動在頁面上的，但是相對父級是佔有空間的，實驗證明他們的top屬性針對的物件不一致：firefox chome IE7、8等不會出問題，就是針對他的直接parent y座標定位，但是遨遊、騰訊等ie核心的包裝瀏覽器就會不一樣，他們針對的是書寫位置的上一個直接物件，這樣做出來的浮動層在瀏覽器下就不相容了，y座標不統一（估計IE6也會有這樣的問題，沒有測過）

    看清楚問題所在解決辦法就很簡單了，將需要relative的元素插在parent元素的最前面，這樣就css統一了，如果你是用的是jquery的話，那麼prepend就是幹這個的，很方便。

    但是這樣做又有一個新的問題，正因為元素是相對絕對定位的（對於父頁面相對，而且佔有空間，對於父的兄弟是絕對的，可以覆蓋），所以 relative後面的部分會被推擠下去，這樣雖然標準統一了，但是這個位置還是會讓佈局變形。

    可以這樣解決：比如有如下一個

         <div style='float:left;'> <div class='Lodding'></div> </div>

    然後再把這一塊附加到需要覆蓋定位的文件內部最後邊，再用top屬性向上或者left向左偏移就可以了，這樣還是可以相容的情況下完成完美定位。