如何解決在IE8中的絕對定位？

在我用過的每個瀏覽器中，除了ie8，絕對定位的元素可以根據最接近的父親定位。如何解決在IE8中的絕對定位？

下面的代碼顯示了表格中的兩個div。頂部div的位置是：relative，但是，嵌套的，絕對定位的元素並不尊重其邊界（在ie8中，它位於頁面的底部而不是父div的底部）。

有沒有人知道這個問題的解決方法？

<style> 
#top { 
position: relative; 
background-color: #ccc; 
} 
#position_me { 
background-color: green; 
position: absolute; 
bottom: 0; 
} 
#bottom { 
background-color: blue; 
height: 100px; 
} 
</style> 
<table> 
    <tr> 
    <td><div id="top"> Div with id="top" 
     <div id="position_me"> Div with id="position me" </div> 
     </div> 
     <div id="bottom"> Div with id="bottom" 
     <p>Lorem ipsum dolor sit amet.</p> 
     </div></td> 
    </tr> 
</table>

來源

2009-09-01 edt

聲明文檔類型。我會鼓勵你使用HTML5文檔類型：

<!DOCTYPE html>

來源

2009-09-01 01:20:23 Sampson

這是監守你不使用的文件類型。和IE工作在"quircks" mode。

試試這個文檔類型：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

來源

2009-09-01 01:27:39 Sergei

補充一點：

#top { 
//height: 100%; 
} 
#position_me { 
//left: 0; 
}

它強制IE8正確計算怪癖模式位置。有許多方法獲得它：

//zoom: 1; 
//writing-mode: tb-rl;

見http://haslayout.net/haslayout

來源

2010-01-28 16:12:49 yakunins

您還可以使用

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

這個固定我的問題！

來源

2011-12-11 21:53:48 Hanno

我總是使用HTML5文檔類型，但在我的情況下，唯一的問題是父元素需要「position：relative;」專門設置。之後，它工作得很好。

來源

2013-04-24 14:48:11 luschn

正確答案！ – leymannx 2014-03-19 17:09:41

如何解決在IE8中的絕對定位？

回答

相關問題