DIV標籤高度不會拉伸以填充父空間

我試圖得到一個嵌套的DIV標籤，包含一個對象標籤，可拉伸至其父容器的剩餘空間。DIV標籤高度不會拉伸以填充父空間

我所擁有的是一個由3個DIV標籤標題內容英尺模板。內容DIV有一個包含另一個HTML頁面的對象。頁眉和頁腳的高度設置爲絕對像素值。我希望內容DIV佔用剩餘的空間。無論我做什麼，似乎我能想到的最好的方法是將DIV內容標籤設置爲屏幕高度的100％。這裏的代碼：

<body> 
<div id="pageWrap"> 
<div id="page"> 
    <div id="header" style="height:68px;"></div> 
    <script type="text/javascript"> 
      $(document).ready(function() { 
       $("#header").load('header.jsp'); 
      }); 
    </script> 
    <div id="mapLocation" style="width:100%; height:100%; overflow:auto;"> 
    <object type="text/html" style="width:100%; height:100%;" data="top/index.html"></object> 
    </div> 
    <div id="footer"></div> 
    <script type="text/javascript"> 
     $(document).ready(function() { 
       $("#footer").load('footer.jsp'); 
     }); 
    </script> 
</div> 
</div> 
</body>

任何解決方案是好的，jQuery，CSS或其他！

感謝您的幫助

Ggilmann

來源

2012-09-21 Ggilmann

認爲這是同一個問題，我在幾個星期前回答： Page fills window with content filling the gap

來源

2012-09-21 15:07:24 robC

什麼空間... – Ggilmann

我想您在其他線程給瞭解決方案，但我無法讓它工作。看起來，我的內容Div標籤中包含的對象覆蓋了高度和寬度屬性，並始終成爲全屏幕的100％。 – Ggilmann

很難說，你的網頁上可能有大量的標記，我不知道！嘗試僅使用我的標記創建一個新的乾淨頁面，然後添加您的對象。如果你不堅持嚴格的xhtml你可能想嘗試使用iframe呢？ – robC

如果你是給你的頭aboslute位置和頁腳然後可能你只是用百分比值？

類似：

#header { 
height:20%; 
} 

#footer { 
height: 20%; 
} 

#div { 
height: 60%; 
}

來源

2012-09-21 13:53:14 atar

問題是，我的頁眉和頁腳的高度是通過一個外部CSS設置與我無法控制該CSS。否則，這可能是我會做的。謝謝！ – Ggilmann

如果你有你有優先權，並且可以通過將上述輕易覆蓋樣式外部CSS後自己的CSS。 –

爲亨裏克說，你可以使用內聯CSS在外部CSS定義的高度，除非聲明！重要的是使用 – atar

DIV標籤高度不會拉伸以填充父空間

回答

相關問題