Html Div 元素内的表格高度 100%
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/13877302/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Table Height 100% inside Div element
提问by Sowmya
Hi I want to set table height 100% to its parent div without define height in div. My code is not working. I dont know what I am missing. Fiddle link
嗨,我想将表格高度 100% 设置为其父 div,而不在 div 中定义高度。我的代码不起作用。我不知道我错过了什么。小提琴链接
<div style="overflow:hidden">
<div style="float:left">a<br />b</div>
<table cellpadding="0" cellspacing="0" height="100%" style="border:solid 1px #000000">
<tr>
<td valign="middle">c</td></tr>
</table>
</div>
回答by Sowmya
回答by Ladineko
You need to have a height in the div <div style="overflow:hidden">
else it doesnt know what 100%
is.
你需要在 div 中有一个高度,<div style="overflow:hidden">
否则它不知道是什么100%
。
回答by Cdeez
This is how you can do it-
这就是你可以做到的 -
HTML-
HTML-
<div style="overflow:hidden; height:100%">
<div style="float:left">a<br>b</div>
<table cellpadding="0" cellspacing="0" style="height:100%;">
<tr><td>This is the content of a table that takes 100% height</td></tr>
</table>
</div>
CSS-
CSS-
html,body
{
height:100%;
background-color:grey;
}
table
{
background-color:yellow;
}
See the DEMO
看演示
Update:Well, if you are not looking for applying 100% height to your parent containers, then here is a jQuery solution that should help you-
更新:好吧,如果您不想为父容器应用 100% 高度,那么这里有一个 jQuery 解决方案可以帮助您-
Script-
脚本-
$(document).ready(function(){
var b= $(window).height(); //gets the window's height, change the selector if you are looking for height relative to some other element
$("#tab").css("height",b);
});
回答by Lisa van Ginneken
Had a similar problem. My solution was to give the inner table a fixed height of 1px and set the height of the td in the inner table to 100%. Against all odds, it works fine, tested in IE, Chrome and FF!
有类似的问题。我的解决方案是给内表一个固定的 1px 高度,并将内表中 td 的高度设置为 100%。无论如何,它运行良好,在 IE、Chrome 和 FF 中进行了测试!
回答by Leon Rom
to set height of table to its container I must do:
要将桌子的高度设置为其容器,我必须这样做:
1) set "position: absolute"
1)设置“位置:绝对”
2) remove redundant contents of cells (!)
2)删除单元格的多余内容(!)