在IE7中相對位置絕對位置頂部顯示？

在我的下面的代碼中，爲什麼div上方顯示第二個文本框？在IE7中相對位置絕對位置頂部顯示？

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
    <head></head> 
    <body> 
     <div style="position:relative;width: 170px;height: 50px;"> 
      <input type="text" /> 
      <div style="position: absolute;z-index: 999999;border: 1px solid;background:#D1C9AF;left:0;top:30px;"> 
       demo text div1 demo text div1 demo text div1 demo text div1 demo text div1 demo text div1 
       demo text div1 demo text div1 demo text div1 demo text div1 demo text div1 demo text div1 
       demo text div1 demo text div1 demo text div1 demo text div1 demo text div1 demo text div1 
      </div> 
     </div>  
     <div style="position:relative;width: 170px;height: 50px;"> 
      <input type="text" /> 
     </div> 
    </body> 
</html>

來源

2011-11-18 user1053579

這是因爲你已經在你的div設置position: absolute。這將元素從頁面流中提取出來，並且意味着它周圍的元素將忽略它將佔用的空間。

下面是一些further reading on CSS positioning

來源

2011-11-18 10:56:28

相對總是在IE7較高Z-index，你可以簡單地刪除那些兩個div相對或絕對位置到相對位置較高z-index的那兩個。

來源

2011-11-18 11:00:34 simoncereska

在IE7中相對位置絕對位置頂部顯示？

回答

相關問題