HTML setting table height to 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</titl开发者_运维百科e>
<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?
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 is html > 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...
加载中,请稍侯......
精彩评论