HTML Table Help - Please!!!

jordank32

Member
Jul 12, 2004
137
0
0
Sorry to double post, but this project is due tomorrow, and I could really use some help, it would be much appreciated.

I am working on a website for a class and I am having a difficult having tables expand properly. I am going to simplify the code so you can get the general idea. I want a table to take the entire height of the page and have 1 row and 3 columns. I want the top row to be 20 pixels, the bottom row to be 20 pixels, and the center row to fill the rest. The code I have works fine in Firefox but not in IE. IE redistributes all of the row heights evenly. I really need this to work. Please help, here is the code:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<link href="main.css" rel="stylesheet" type="text/css">
</head>

<body>
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="fullheight">
<tr>
<td height="20" bgcolor="#FFFF00"> </td>
</tr>
<tr>
<td bgcolor="#990000"> </td>
</tr>
<tr>
<td height="20" bgcolor="#FFFF00"> </td>
</tr>
</table>
</body>
</html>

And the .css

html, body{
height:100%;
margin: 0;
padding: 0;
border: none;
}
.fullheight{
background-color: #FFFFFF;
height:100%;
margin: 0 auto;
}
 

brentman

Senior member
Dec 4, 2002
628
0
0
try controlling the heights of the top and bottom rows with CSS. you could toss in a style="{height: 20px;}" into the <tr> tags for the appropriate rows.

Or you could try just moving the height parameter from your TD to the TR tags.
 

jordank32

Member
Jul 12, 2004
137
0
0
thanks for the suggestions, but neither of those suggestions seemed to work, any other ideas
 

KingPhil

Golden Member
Apr 27, 2000
1,154
0
0
Send me all your code.............. I"ll see what I can do........ post it here.
 

jordank32

Member
Jul 12, 2004
137
0
0
Thanks for the screenshot. That is bizarre, not what I get at all. Any suggestions for why that would be happening?
 

KingPhil

Golden Member
Apr 27, 2000
1,154
0
0
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<link href="main.css" rel="stylesheet" type="text/css">
</head>

<body>
<table width="100%" height="100%" border="0">
<tr>
<td height="20" bgcolor="#FFFF00"></td>
</tr>
<tr>
<td bgcolor="#993300"></td>
</tr>
<tr>
<td height="20" bgcolor="#FFFF00"></td>
</tr>
</table>
</body>
</html>



***Not 100% like your screenshot but you get the idea?***
 

KingPhil

Golden Member
Apr 27, 2000
1,154
0
0
Originally posted by: jordank32
Thanks for the screenshot. That is bizarre, not what I get at all. Any suggestions for why that would be happening?

I think its his style sheet. Any luck with what I sent yet?
 

KingPhil

Golden Member
Apr 27, 2000
1,154
0
0
needed to add height="100%"

BAM, seemed to fix it. Because he had the top and bottom bars set to 20, but the middle set to nothing, it just crunched the middle to nothing........
 

jordank32

Member
Jul 12, 2004
137
0
0
that is strange because I already had height=100% in my style sheet. That did work though. however, I just tried to transfer that over to my actual website and it didn't work in IE. I was hoping you could take a look at the code:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<link href="main.css" rel="stylesheet" type="text/css">
</head>

<body>
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td height="20">
<img src="images/top_orange.gif" width="200" height="20"></td>
<td><img src="images/top_left_gray.gif" width="20" height="20"></td>
<td background="images/horiz_gray.gif"></td>
<td><img src="images/top_right_gray.gif" width="20" height="20"></td>
</tr>
<tr>
<td width="200" valign="top" bgcolor="#FF9900"></td>
<td width="20" background="images/vert_gray.gif"></td>
<td valign="top">
<IFRAME SRC="money_ch1_content1.html" scrolling="yes" width="600">
</IFRAME>

</td>
<td width="20" background="images/vert_gray.gif"></td>
</tr>
<tr>
<td height="20"><img src="images/bottom_orange.gif" width="200" height="20"></td>
<td><img src="images/bot_left_gray.gif" width="20" height="20"></td>
<td background="images/horiz_gray.gif"></td>
<td><img src="images/bot_right_gray.gif" width="20" height="20"></td>
</tr>
</table>
</body>
</html>


THANKS SO MUCH FOR YOUR HELP
 

KEV1N

Platinum Member
Jan 15, 2000
2,932
1
0
Seeing tables (for non-tabular data) makes me cry a little..but that's because I'm a geek.
 

torpid

Lifer
Sep 14, 2003
11,631
11
76
Originally posted by: KEV1N
Seeing tables (for non-tabular data) makes me cry a little..but that's because I'm a geek.

Apparently a geek who has never been exposed to the real world where users don't always use the browser you want them to and you can't afford to spend the time implementing something twice.