IE6 對於 CSS position:fixed 的修正解法

IE6 不支援 CSS position:fixed 的 寫法, 所以需要用其他寫法達成.

網路上可以找到的解法非常多, 都列在下面的相關網頁當參考資料, 有興趣的在自行研究囉~

IE6 對於 CSS position:fixed 的修正解法

在此直接寫我的作法:

#id_or_class_name {
    position:fixed!important;
    _position:absolute;
    bottom:0;
    /*_bottom:-20px;*/
    _z-index:10;
    right:0;
}

強制設定此 CSS 的 position:fixed 不會被下面覆蓋掉(IE6 不支援此語法, 所以不會被影響), 然後, IE6 在使用 absolute 並設置固定在右下角(bottom:0, right:0).

修改時, 一般瀏覽器修改 bottom, right, 針對 IE6 修改 _bottom, _right 等. (以上 right 重複可以共用, 就不寫在上面. (若是要出現在其他區域, 自行修改成 top / left.. 等即可.)

註: _bottom, _z-index 都是給 IE6 看的.

IE6 對於 CSS position:fixed 的修正解法2

這篇的解法我沒有測試, 但是看起來是類似的, 寫法比較簡短, 詳見: IE6 的 position:fixed Hack, 下述摘錄自此篇解法:

html, body {height:100%; overflow: auto;}
div {position:absolute;}
body>div {position:fixed;}

註: 前兩行是針對 IE6, 最後那一行就是給一般的瀏覽器.

相關網頁

作者: Tsung

對新奇的事物都很有興趣, 喜歡簡單的東西, 過簡單的生活.

發表迴響

這個網站採用 Akismet 服務減少垃圾留言。進一步了解 Akismet 如何處理網站訪客的留言資料