Html table dynamic height
What im trying to do is to get this page to expand in height to the size of the client browser. I have the header, the menubar, and the footer a specific heights but I want the content part of the table to expand to the rest of the width of the page so it is always full screen in width. Here is my code, and if someone could help me figure it out would be great. Thanks.
Code:
<style>
html,body
{
margin:0;
height:100%;
cellpadding:0;
cellspacing:0;
}
</style>
<div align="center">
<center>
<table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="780">
<tr>
<td background="images/xcessivelayout_02.gif" height="231"> </td>
</tr>
<tr>
<td background="images/xcessivelayout_04.gif" height="26"> </td>
</tr>
<tr>
<td background="images/xcessivelayout_05.gif" height="100%"> </td> <!-- THIS TD/TR NEEDS TO FILL THE REST OF THE HEIGHT OF THE PAGE -->
</tr>
<tr>
<td background="images/xcessivelayout_06.gif" height="26"> </td>
</tr>
</table>
</center>
</div>
Re: Html table dynamic height
First of all, body and html do not have height properties.
Second, when declaring 100%, you can't use other heights in your TD because 100% is already in use. Simply make the whole table 100% and omit that TDs height.
HTML Code:
<style>
html,body
{
margin:0;
cellpadding:0;
cellspacing:0;
}
</style>
<div align="center">
<center>
<table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="780" height=100%>
<tr>
<td background="images/xcessivelayout_02.gif" height="231"> </td>
</tr>
<tr>
<td background="images/xcessivelayout_04.gif" height="26"> </td>
</tr>
<tr>
<td background="images/xcessivelayout_05.gif"> </td> <!-- omit this height table height will do the rest -->
</tr>
<tr>
<td background="images/xcessivelayout_06.gif" height="26"> </td>
</tr>
</table>
</center>
</div>
Re: Html table dynamic height
That worked. Thanks. Looks like i need to catch back up on my HTML :)
Re: Html table dynamic height
You're welcome. And don't forget your CSS. ;)
