Hi there,
I'm new to this forum. I need help on how to maximize a table cell height.
First I have a table layout that has 3 rows, the first and third rows have fix 50px height.
I want to max the height of the of the 2nd row to fill the remaining space.
This works fine in firefox 2 but not in IE7. the height 100% in the ie 7 causes to overlap the body which cause to create a vertical scroll bar.
how should I do this. what would be the proper value for the 2nd row? I need help.
Also if you put a nested table in the 2nd row without row height define, the 100% height table won't stretch.
here's the code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
</head>
<style>
html, body{
height:96%;
}
body{
border: 1px solid red;
}
</style>
<body>
<table border="1" cellspacing="5" cellpadding="5" style="height:100%; width:100%">
<tr>
<td style="width:100%;height:50px"> row 1 col 1</td>
</tr>
<tr>
<td style="width:100%;height:100%"> row 2 col 1</td>
</tr>
<tr>
<td style="width:100%;height:50px"> row 3 col 1</td>
</tr>
</table>
</body>
</html>
regards,
boyetp
Last edited by peter_budo : Apr 24th, 2008 at 7:47 pm. Reason: Keep It Organized - please use [code] tags
