絕對定位的元素沒有得到100％的高度

這裏是我的代碼（有點簡化）絕對定位的元素沒有得到100％的高度

<thisIsADiv id="wrapper" style="width:960px; margin:0 auto; position: relative;"> 
    <img src="img/bg/wrapper.jpg" alt="" width="960" id="bg" style="position:absolute; top:0; left:0; z-index:0; height:100%;" /> 
    <some more stuff></stuff> 
</thisIsADiv >

這裏是我的問題：如果我給我的形象，100％的高度它工作正常在Firefox/Chrome瀏覽器（它一直延伸allong它的包裝），而在瀏覽器中，它繼承了頁面高度！造成頁面過大。我試着用height = inherit，但是在firefox/chrome中image沒有伸展，在資源管理器中問題依舊。高度=自動：在F/C +瀏覽器中與上面相同也不會拉伸。

有什麼想法？謝謝維託

來源

2010-05-21 vitto

代碼沒有顯示，您是否正確格式化？ – Kyle 2010-05-21 10:24:11

我想我做了錯誤的事情..去閱讀規則！ – vitto 2010-05-21 10:28:16

嘗試設置一個高度爲您的wrapper股利。

編輯： IE不喜歡z-index: 0;所以設置爲1，並相應地調整你的其他指標，爲什麼不只是在風格中使用背景圖像？

來源

2010-05-21 10:29:01 Kyle

我無法給包裝一個高度，因爲它的內容在每個頁面中都有變化，而最小高度也不起作用。 – vitto 2010-05-21 10:38:44

我使用img，因爲我需要它沿着它的容器拉伸，如果我使用bg圖像，我不能那樣做（我認爲）。我也使用z-index：0，這樣我就不需要給圖像上顯示的所有下列元素給出z-index。無論如何，我設置正確的Z指數，它不工作 – vitto 2010-05-21 10:49:21

你有一個現場的例子？另外，我告訴你的「z-index」只是一個普通的IE修復，並不是爲了解決你的問題，只是想我應該讓你知道。 – Kyle 2010-05-21 10:59:27

而不是height:100%在圖像上使用bottom:0。

來源

2012-10-28 10:23:37 DanMan

你需要指定height & width絕對定位的元素，有時IE是在其顯示正確，你也覺得它錯了，因爲FF &鉻（他們修復你的代碼）：

<div id="wrapper" style="width:960px; margin:0 auto;position: relative;"> 
    <img src="img/bg/wrapper.jpg" alt="" width="960" id="bg" style="position:absolute; top:0; left:0;height:theheightofyourimage;"> 
</div>

position: absolute自動獲得z-index 1。

來源

2012-10-28 10:48:13 Mark

絕對定位的元素沒有得到100％的高度

回答

相關問題