HTML 将表格高度设置为 100%
我尝试过这样做,但它似乎被忽略了。我发现有几篇文章说,如果你想这样做,那么你必须确保父对象也是 100%。我有以下内容:
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server" style="height:100%">
<title>Untitled Page</title>
<asp:ContentPlaceHolder id="head" runat="server">
</asp:ContentPlaceHolder>
<style type="text/css">
.MasterStyle
{
width: 98%;
height: 100%;
}
.ContentStyle
{
width: 100%;
}
.TableStyle
{
width: 133px;
height: 100%;
}
</style>
</head>
<body class="MasterStyle">
<form id="frmMaster" runat="server">
<div class="ContentStyle">
<asp:Label runat="server" Text="My Site Name" Font-Bold="true" Font-Names="MS-Sans"
Style="text-align:right" Width="100%" />
<br />
</div>
<hr />
<table style="width:100%; height:100%" border="true">
<tr>
<td class="TableStyle" style="height:100%">
我在桌子周围有一个边框,可以看到它没有填满高度。谁能告诉我为什么我的身高没有达到100%?
I’ve tried doing this, but it seems to just be ignored. I found a few articles saying that if you wanted to do this then you had to make sure that the parent object was also 100%. I have the following:
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server" style="height:100%">
<title>Untitled Page</title>
<asp:ContentPlaceHolder id="head" runat="server">
</asp:ContentPlaceHolder>
<style type="text/css">
.MasterStyle
{
width: 98%;
height: 100%;
}
.ContentStyle
{
width: 100%;
}
.TableStyle
{
width: 133px;
height: 100%;
}
</style>
</head>
<body class="MasterStyle">
<form id="frmMaster" runat="server">
<div class="ContentStyle">
<asp:Label runat="server" Text="My Site Name" Font-Bold="true" Font-Names="MS-Sans"
Style="text-align:right" Width="100%" />
<br />
</div>
<hr />
<table style="width:100%; height:100%" border="true">
<tr>
<td class="TableStyle" style="height:100%">
I have a border around the table and can see that it’s not filling the height. Can anyone tell me why I’m not getting 100% height?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
我相信这也依赖于浏览器,实现略有不同......
但也请尝试将
设置为 100% 的高度,因为它是
周围的元素。层次结构是
html
>正文
>table
,如果最外面的元素没有设置为100%,里面的元素就不能变大。编辑:
仔细查看您的源代码,我相信您的表格实际上位于
html
>正文
>表单
>table
,所以也许您还需要将表单高度设置为 100%。我注意到您的设置为 100 %,最好将其删除,因为
不是表层次结构的一部分。您永远不会为
设置高度可能会混淆渲染引擎......
I believe this is also browser dependant, the implementations vary a little bit...
But try setting
<html>
to a height of 100 % as well, since it is the element surrounding<body>
. The hierarchy ishtml
>body
>table
, if the outermost element is not set to 100%, the inner ones can not get any bigger.Edit:
Looking closer at your source code, I believe that your table is actually sitting at
html
>body
>form
>table
, so maybe you nee to set the form height to 100 %, too. And I noticed that your<head>
is set to 100 %, better remove that, since<head>
is not part of the hierarchy of your table. You never how setting a height for<head>
might confuse a rendering engine...