HTML variable and fixed rows all in a 100% height table

admin · Jan 10, 2008

I have 5 <tr> into a table. They have the following: 
 
1st row: banner 
2nd row: nav bar 
3rd row: iframe 
4th row: options 
5th row: footer 
 
This general table has a 100% height. 
Structure is as simple as that. 1st, 2nd and 5th rows are fixed in height. 
And here comes my problem: I need 3rd row to have the same height as the 
iframe and the 4th row should have a variable height according to the 3rd 
one. 
 
I'm working on this code and it's almost done but content at 4th row doesn't 
work. It's like it has a minor heigth that it should have. 
 
I'm giving away this code. Could anyone help me? 
Here's the main code: 
 
 
MAIN CODE 
<html> 
<head> 
<title>testing...</title> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> 
<style type="text/css"> 
 
</style> 
</head> 
 
<body> 
 
<table width="775" align="center" height="100%" cellspacing="0" 
cellpadding="0" bgcolor="#FFFFFF"> 
 
 
 
<tr> 
<td width="775" height="66"><img src=http://www.htmlforums.com/archive/index.php/"images/dm_banner.jpg" width="775" 
height="66"></td> 
</tr> 
 
 
 
 
<tr> 
<td width="775" height="14"> 
<table width="775" cellpadding="0" cellspacing="0" bgcolor="#FFF5E5"> 
<tr> 
<td> 
OPTION 1 - OPTION 2 - OPTION 3 - OPTION 4 
</td> 
</tr> 
</table></td> 
</tr> 
 
 
 
 
<tr height="100%"> 
<td width="775"> 
<iframe src=http://www.htmlforums.com/archive/index.php/"iframe.htm" WIDTH=775 height="100%" scrolling=No 
frameborder="0"></iframe> 
</td> 
</tr> 
 
 
 
 
<tr width="775" height="100%"> 
<td> 
1. Option 1 
2. Option 2 
3. Option 3 
</td> 
</tr> 
 
 
 
<tr> 
<td width="775" height="39" align="center"><img src=http://www.htmlforums.com/archive/index.php/"footer.jpg" 
width="279" height="39"></td> 
</tr> 
 
</table> 
 
</body> 
</html> 
 
 
Here's the iframe page code 
 
IFRAME.HTM 
<html> 
<head> 
<title>Untitled Document</title> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> 
<style type="text/css"> 
 
</style> 
</head> 
 
<body> 
<table width="775" height="300" align="center" cellpadding="0" 
cellspacing="0" bgcolor="EEEEEE"> 
<tr valign="top"> 
<td> 
<table width="100%" cellpadding="0" cellspacing="0"> 
<tr> 
<td>Text 1</td> 
</tr> 
<tr> 
<td>Text 2</td> 
</tr> 
<tr> 
<td>Text 3</td> 
</tr> 
</table> 
</td> 
</tr> 
</table> 
</body> 
</html> 
 
 
Thanks in advance, 
-- 
Marcelo BalgurevichI would suggest using separate tables myself, but there is probably another solution, thats what i'd do off the top of my head... jaemanAnd here comes my problem: I need 3rd row to have the same height as the 
iframe and the 4th row should have a variable height according to the 3rd 
one. 
 
I'm working on this code and it's almost done but content at 4th row doesn't 
work. It's like it has a minor heigth that it should have. 
 
I'm giving away this code. Could anyone help me? 
then don't give it a height. and thanks for giving it away, I don't know what I would do without it.

maybe you should validate your code before you give it away, you have many deprecated tags in there

HTML variable and fixed rows all in a 100% height table

admin

Administrator