IE css-要展开以填充剩余高度的最后一行表格
给定如下HTML,如何让最后一行占据剩余的高度,并让n-1第一行占据所需的高度 这似乎在Chrome中起作用,但在Firefox2或IE6/7/8中不起作用IE css-要展开以填充剩余高度的最后一行表格,css,html-table,cross-browser,row,Css,Html Table,Cross Browser,Row,给定如下HTML,如何让最后一行占据剩余的高度,并让n-1第一行占据所需的高度 这似乎在Chrome中起作用,但在Firefox2或IE6/7/8中不起作用 <table> <tr> <td rowspan="5"><div style="border: 1px solid #cdcdcd; width: 100px; height: 300px;"/></td> <td/> </tr>
<table>
<tr>
<td rowspan="5"><div style="border: 1px solid #cdcdcd; width: 100px; height: 300px;"/></td>
<td/>
</tr>
<tr>
<td>one</td>
</tr>
<tr>
<td>two</td>
</tr>
<tr>
<td>three</td>
</tr>
<tr>
<td>full</td>
</tr>
</table>
一
二
三
满的
因此,我们的想法是,最后一行,其中有“full”,应该是非常高的,而其他几行,“one”、“two”和“three”应该尽可能小
我试过这样的方法,比如在每一排上精确的高度,说“我在最后一排上尝试了100%的高度,到目前为止没有运气
更新:
此布局将用于不同类型的内容,目的是让表格根据内容调整自身大小。有时div会很高,然后它的高度决定表格的高度,但有时div很短,然后行(一、二、三)决定表格的高度。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html><body>
<table border=1>
<tr>
<td rowspan="2"><div style="border: 1px solid #cdcdcd; width: 100px; height: 300px;"/></td>
<td valign=top style="padding:0px;">
<table height=1>
<tr>
<td>one</td>
</tr>
<tr>
<td>two</td>
</tr>
<tr>
<td>three</td>
</tr>
<tr>
<td valign=top>full<br><br><br>more full</td>
</tr>
</table>
</td>
</tr>
</table>
</body></html>
一
二
三
满
更满
Updatedx3,在ie6/ff中工作如果javascript正常,您可以使用jQuery查找最后一行的顶部位置以及窗口或元素底部的位置。差值应设置为最后一行的高度
我还没有编写任何代码,因为我不确定您是在查找对象内部的表还是将其填充到窗口底部。如果您想了解更多详细信息,我可以为您这样做。我没有快速的答案,但我认为您必须使用javascript来实现此功能。我希望不会出现问题n javascript解决方案:)同意,经过进一步测试后,我收回了我以前的答案,因为它根本无法解决高度问题。对此表示抱歉。:-/1.我在基于表格的布局上投入了大量资金,因此如果可能的话,我需要坚持使用表格。2.我想你会不同意我的观点,但divs在表格布局方面真的很差劲。我不认为se身高:100%;我希望桌子能达到它需要的高度,而不是它的容器那么高。根据定义,“它需要的高度”是固定的高度,但带有“满”“一个折叠了,也许你想在最后一个元素上设置
最小高度:##%
?表格的高度应该是其内容的高度-固定高度的内容(div)可能是最高的,也可能是很短的,那么行(一、二、三)可能是最高的。好了,更新了html,现在应该可以工作了。”,高度:1px
不要紧,如果内容认为必要,它会扩展。谢谢。目的是表格的高度应该是其内容的高度。