IE7的DIV擴展到適合TABLE，忽略HEIGHT％指令

我真的很感謝在IE7中獲得固定頭表的滾動功能。IE7的DIV擴展到適合TABLE，忽略HEIGHT％指令

在IE7中，我的高數據表強制其包含的DIV垂直展開，並阻止顯示DIV的滾動條。我正在使用優秀的跨瀏覽器（包括IE7）滾動，固定表頭佈局解決方案： http://www.sitepoint.com/forums/showthread.php?t=615364&page=3 ，但我已對其進行了修改，以便表格填充頁面。

這裏是如何看起來在實踐：

<style> 
html, body { width: 100%; height: 100%; padding: 0; margin: 0; } 
#results { position: absolute; top: 2em; bottom: 0; width: 100%; } 
#results div { width: 100%; height: 100%; overflow: auto; overflow-x: hidden; } 
#results table { width: 100%; } 
#results table th p { position: absolute; top: -2em; } 
</style> 
<body> 
    <div id='results'> <!-- provides position referece to headers --> 
    <div>   <!-- scrolls the table it contains --> 
     <table>  <!-- incorrectly expands parent div in IE7 --> 
     <tr><th><p>FIXED-HEADER HERE</p></th></tr> 
     <tr><td>TALL CONTENT HERE</td></tr> 
     </table> 
    </div> 
    </div> 
</body>

我很高興與標題和滾動工作在FF和IE8如何。 IE7中的調試工具顯示#results具有所需的高度，但DIV和TABLE共享相同的非常高的值，其中DIV實際上應該是#results的高度。如果我將DIV高度從％更改爲px單位，它會滾動，但當然不再適當調整大小。

我使用嚴格的文檔類型。我的表實際上包含表格數據，通常是10列和200行，所以表格在語義上是準確的。當然，這張桌子上有更多的內容。

我不想用動態尺寸的javascript，除非它非常簡單，它是防彈的，因爲我總是以愚蠢的缺陷結束（哦，是的，我不認爲在你重新評估尺寸時將鼠標懸停在超鏈接上，線條高度發生變化等）。

謝謝香

來源

2010-10-27 Shannon

我在想你需要給'div＃results'指定一個'height'值。 – drudge 2010-10-27 00:47:04

@jnpcl謝謝。根據CSS規則，設置頂部和底部應該定義高度。這不會阻止我指定它來滿足IE7，所以在你的建議，我試着明確設置高度：汽車，但它沒有幫助。我無法指定％，因爲我不希望表格標題比調整瀏覽器窗口高度時包含的文本更小。 – Shannon 2010-10-27 00:57:14

通過包裝DIV（同時保持現有的樣式規則）在：

<div style="position: absolute; height: 100%; width: 100%;" } ></div>

問題得到解決。 IE7內部再次罷工。可能有更優雅的方法來解決它，不需要更多的結構標記，如果您知道它，我很樂意聽到它。

Shannon

來源

2010-10-27 01:47:14 Shannon

你將哪個div應用於？而'''是故意的？ – 2011-08-30 21:37:37

IE7的DIV擴展到適合TABLE，忽略HEIGHT％指令

回答

相關問題