Howdy. I know this has probably been addressed a bazillion times, but I didn't find the answer via a search. Since this is my second official post here, go easy on me, dig?<br />
<br />
<!-- m --><a class="postlink" href="http://www.thefreezone.org">http://www.thefreezone.org</a><!-- m --><br />
<br />
This is the site for my radio show. When I design, I preview in IE, Netscape and Opera. I have defined table cell heights for all but the bottom cells in the two side columns. The middle column sometimes runs long. My intent is that the bottom left and right column cells expand to account for the added height in the middle column. This works in Netscape and Opera, but IE insists on distributing the difference more or less equally between all the cells. <br />
<br />
I know most people are viewing the site in IE of some flavor. Is there a way I can achieve some consistency here?<!--content-->Do you have an image or something of how you want it to look like!? 'Cause I'm looking in N7 and IE... they look a tad different but still looks good!?<!--content-->Here some captured/cropped images of what I'm talking about.<br />
<br />
Explorer:<br />
<!-- m --><a class="postlink" href="http://www.thefreezone.org/images/test/iecapture.jpg">http://www.thefreezone.org/images/test/iecapture.jpg</a><!-- m --><br />
<br />
Netscape:<br />
<!-- m --><a class="postlink" href="http://www.thefreezone.org/images/test/nscapture.jpg">http://www.thefreezone.org/images/test/nscapture.jpg</a><!-- m --><br />
<br />
The bottom is the preferable result. I want to force all but the bottom cells on either side to a certain height, and make the bottom cells (Request Line and Contents) be the only cells that change their height based on the height of the middle cell.<!--content-->you have to insert the other info (in that cell) into tables by themselves in that cell and align them to the top of said cell.<!--content-->Not entirely clear on what you mean. Are you saying to nest a table inside the bottom left and right cells that just contains the content? Can you explain how that would help?<br />
<br />
I've been messing with an alternate design that uses nested tables, but have thus far been unhappy with what I've achieved. Probably my own sophomoric design abilities, but I'll keep playing.<!--content-->Originally posted by chandler <br />
Not entirely clear on what you mean. Are you saying to nest a table inside the bottom left and right cells that just contains the content? Can you explain how that would help? <br />
correct. the nested table will stay at the top of that cell when the page gets long. so for example say this is the cell<br />
<br />
<br />
<td valign="top"><br />
<table><br />
that content here<br />
</table><br />
<br />
</td><br />
<br />
something to that effect. that would make the content stay at the top like in your second image.<!--content-->The content itself is top-aligning properly. It's that I want that row of cells to expand while the other stay static. <br />
<br />
Here's my code so you can see what I've done:<br />
<br />
<tr><br />
<td align="left" valign="top" width="175" bgcolor="#ffcc66" height="425"><br />
<?php include "php/adds.html"; ?></td><br />
<br />
<td width="200" bgcolor="#CC9900" valign="top" height="425"> <br />
<?php include "php/particulars.html"; ?></td><br />
</tr><br />
<br />
<tr><br />
<td width="175" bgcolor="#ffcc66" align="left" valign="top"><br />
<?php include "php/request.html"; ?></td><br />
<br />
<td width="200" bgcolor="#CC9900" align="left" valign="top"><br />
<?php include "php/contents.html"; ?></td><br />
</tr><br />
<br />
The cells I want to expand are the bottom ones, hence no height tag. The cells immediately above have height tags defined, but IE seems to ignore all that. Is it just a browser issue that I'm going to have to deal with?<!--content-->Fix all the other [errors (<!-- m --><a class="postlink" href="http://validator.w3.org/check?uri=http%3A%2F%2Fwww.thefreezone.org%2F&charset=%28detect+automatically%29&doctype=HTML+4.01+Transitional&ss=1&outline=1&sp=1&verbose=1">http://validator.w3.org/check?uri=http% ... &verbose=1</a><!-- m -->)] while you are in there.<br />
<br />
<br />
You have missed off the closing </a> tag on some of your links.<br />
<br />
<br />
Change the & in URLs to be & instead, to fix the entity errors.<br />
<br />
<br />
Add type="text/javascript" on each <script> tag.<br />
<br />
<br />
Add type="text/css" on each <style> tag.<br />
<br />
<br />
There are nesting errors in the table code.<br />
<br />
<br />
Post again with any that you cannot fix.<!--content-->Originally posted by chandler <br />
The content itself is top-aligning properly. It's that I want that row of cells to expand while the other stay static. <br />
<br />
Here's my code so you can see what I've done:<br />
<br />
<tr><br />
<td align="left" valign="top" width="175" bgcolor="#ffcc66" height="425"><br />
<?php include "php/adds.html"; ?></td><br />
<br />
<td width="200" bgcolor="#CC9900" valign="top" height="425"> <br />
<?php include "php/particulars.html"; ?></td><br />
</tr><br />
<br />
<tr><br />
<td width="175" bgcolor="#ffcc66" align="left" valign="top"><br />
<?php include "php/request.html"; ?></td><br />
<br />
<td width="200" bgcolor="#CC9900" align="left" valign="top"><br />
<?php include "php/contents.html"; ?></td><br />
</tr><br />
<br />
The cells I want to expand are the bottom ones, hence no height tag. The cells immediately above have height tags defined, but IE seems to ignore all that. Is it just a browser issue that I'm going to have to deal with? <br />
it doesn't matter what height you use. the cell will alway stretch and so the content goes with it. just try adding the table to that and see what it does.<br />
<br />
I am taking that the light brown (tan and the dark brown are the ones that expand depending on the content in the middle. than yes you will have to nest a talbe in the left and right cells<br />
<br />
<td width="200" bgcolor="#CC9900" align="left" valign="top"><br />
<table><br />
<?php include "php/contents.html"; ?><br />
</table><br />
</td><br />
</tr><br />
<br />
<br />
but actually it may be the top cell expanding as well. you can try to add an empty cell at the very bottom and have them as teh ones that expand depending on the content in the middle.<!--content-->I recently used this method, think it's the same as what scoutt is advising you.<br />
<br />
Using height in table cells is causing all your problems (you shouldn’t) and dragging the other columns down. Build the main content of the page in one table, 3 columns wide by 1 row high, insert a table into each of those columns and each columns content will be independent of the other columns. You only need valign=â€Âtop†the main table row then. Whichever column grows longest won’t matter.<br />
<br />
Also, make the middle column stretchy to better accommodate different screen res, width=â€Â*†will make the middle column stretchy. As giz said, fix the errors and shift a lot of the content (text and maybe bgcolor's) over to css in an external style sheet. I’ve used your widths for left and right column only.<br />
<br />
To get your horizontal white lines use a 1x1px transparent gif in a white table row. Stretch the height of the gif for your thickness, not the height of the row or cell.<br />
<br />
<!-- separate table for your head bar here --><br />
<br />
<table width="100%" cellpadding="0" cellspacing="5" border="0"><br />
<tr valign="top"><!-- holds it all at the top --><br />
<td width="175" bgcolor="FFCC66"> <!-- left column table here --></td><br />
<td width="*" bgcolor="#FF9900"> <!-- centre column table here--></td><br />
<td width="200" bgcolor="#CC9900"> <!-- right column table here --></td><br />
</tr><br />
</table><!--content-->Working on the error fixes (some of them aren't mine, they're in the two banners I have on the site). I'm still learning CSS on my lunch hours at work. That's my next project.<br />
<br />
I totally understand how to fix the tables now, though. Thanks so much y'all. I'll post the results soon.<!--content-->Down from 55 errors to 22. You are getting there.<br />
<br />
<br />
All <style> code must be in the <head> section.<br />
<br />
<br />
The <form> ... </form> tags and the missing </table> tag are messing things up as well.<!--content-->Fixed the <style> tags. The <form></form> stuff is in a banner that I didn't do. I know next to nothing about forms. In fact, pretty much all the errors that are left aren't mine. Hooray for me I suppose. <br />
<br />
Except that y'alls some sticklers, and you'll probably call me on some other stuff. But that's what I'm here for.
<!--content-->I'm still nervous about the remaining nesting errors inside the table:<br />
<tr> not allowed here and </table> element missing and so on.<!--content-->Yeah, I'm not entirely sure what to do about that. I do so love copy-and-paste code that other people have made.<!--content-->
<br />
<!-- m --><a class="postlink" href="http://www.thefreezone.org">http://www.thefreezone.org</a><!-- m --><br />
<br />
This is the site for my radio show. When I design, I preview in IE, Netscape and Opera. I have defined table cell heights for all but the bottom cells in the two side columns. The middle column sometimes runs long. My intent is that the bottom left and right column cells expand to account for the added height in the middle column. This works in Netscape and Opera, but IE insists on distributing the difference more or less equally between all the cells. <br />
<br />
I know most people are viewing the site in IE of some flavor. Is there a way I can achieve some consistency here?<!--content-->Do you have an image or something of how you want it to look like!? 'Cause I'm looking in N7 and IE... they look a tad different but still looks good!?<!--content-->Here some captured/cropped images of what I'm talking about.<br />
<br />
Explorer:<br />
<!-- m --><a class="postlink" href="http://www.thefreezone.org/images/test/iecapture.jpg">http://www.thefreezone.org/images/test/iecapture.jpg</a><!-- m --><br />
<br />
Netscape:<br />
<!-- m --><a class="postlink" href="http://www.thefreezone.org/images/test/nscapture.jpg">http://www.thefreezone.org/images/test/nscapture.jpg</a><!-- m --><br />
<br />
The bottom is the preferable result. I want to force all but the bottom cells on either side to a certain height, and make the bottom cells (Request Line and Contents) be the only cells that change their height based on the height of the middle cell.<!--content-->you have to insert the other info (in that cell) into tables by themselves in that cell and align them to the top of said cell.<!--content-->Not entirely clear on what you mean. Are you saying to nest a table inside the bottom left and right cells that just contains the content? Can you explain how that would help?<br />
<br />
I've been messing with an alternate design that uses nested tables, but have thus far been unhappy with what I've achieved. Probably my own sophomoric design abilities, but I'll keep playing.<!--content-->Originally posted by chandler <br />
Not entirely clear on what you mean. Are you saying to nest a table inside the bottom left and right cells that just contains the content? Can you explain how that would help? <br />
correct. the nested table will stay at the top of that cell when the page gets long. so for example say this is the cell<br />
<br />
<br />
<td valign="top"><br />
<table><br />
that content here<br />
</table><br />
<br />
</td><br />
<br />
something to that effect. that would make the content stay at the top like in your second image.<!--content-->The content itself is top-aligning properly. It's that I want that row of cells to expand while the other stay static. <br />
<br />
Here's my code so you can see what I've done:<br />
<br />
<tr><br />
<td align="left" valign="top" width="175" bgcolor="#ffcc66" height="425"><br />
<?php include "php/adds.html"; ?></td><br />
<br />
<td width="200" bgcolor="#CC9900" valign="top" height="425"> <br />
<?php include "php/particulars.html"; ?></td><br />
</tr><br />
<br />
<tr><br />
<td width="175" bgcolor="#ffcc66" align="left" valign="top"><br />
<?php include "php/request.html"; ?></td><br />
<br />
<td width="200" bgcolor="#CC9900" align="left" valign="top"><br />
<?php include "php/contents.html"; ?></td><br />
</tr><br />
<br />
The cells I want to expand are the bottom ones, hence no height tag. The cells immediately above have height tags defined, but IE seems to ignore all that. Is it just a browser issue that I'm going to have to deal with?<!--content-->Fix all the other [errors (<!-- m --><a class="postlink" href="http://validator.w3.org/check?uri=http%3A%2F%2Fwww.thefreezone.org%2F&charset=%28detect+automatically%29&doctype=HTML+4.01+Transitional&ss=1&outline=1&sp=1&verbose=1">http://validator.w3.org/check?uri=http% ... &verbose=1</a><!-- m -->)] while you are in there.<br />
<br />
<br />
You have missed off the closing </a> tag on some of your links.<br />
<br />
<br />
Change the & in URLs to be & instead, to fix the entity errors.<br />
<br />
<br />
Add type="text/javascript" on each <script> tag.<br />
<br />
<br />
Add type="text/css" on each <style> tag.<br />
<br />
<br />
There are nesting errors in the table code.<br />
<br />
<br />
Post again with any that you cannot fix.<!--content-->Originally posted by chandler <br />
The content itself is top-aligning properly. It's that I want that row of cells to expand while the other stay static. <br />
<br />
Here's my code so you can see what I've done:<br />
<br />
<tr><br />
<td align="left" valign="top" width="175" bgcolor="#ffcc66" height="425"><br />
<?php include "php/adds.html"; ?></td><br />
<br />
<td width="200" bgcolor="#CC9900" valign="top" height="425"> <br />
<?php include "php/particulars.html"; ?></td><br />
</tr><br />
<br />
<tr><br />
<td width="175" bgcolor="#ffcc66" align="left" valign="top"><br />
<?php include "php/request.html"; ?></td><br />
<br />
<td width="200" bgcolor="#CC9900" align="left" valign="top"><br />
<?php include "php/contents.html"; ?></td><br />
</tr><br />
<br />
The cells I want to expand are the bottom ones, hence no height tag. The cells immediately above have height tags defined, but IE seems to ignore all that. Is it just a browser issue that I'm going to have to deal with? <br />
it doesn't matter what height you use. the cell will alway stretch and so the content goes with it. just try adding the table to that and see what it does.<br />
<br />
I am taking that the light brown (tan and the dark brown are the ones that expand depending on the content in the middle. than yes you will have to nest a talbe in the left and right cells<br />
<br />
<td width="200" bgcolor="#CC9900" align="left" valign="top"><br />
<table><br />
<?php include "php/contents.html"; ?><br />
</table><br />
</td><br />
</tr><br />
<br />
<br />
but actually it may be the top cell expanding as well. you can try to add an empty cell at the very bottom and have them as teh ones that expand depending on the content in the middle.<!--content-->I recently used this method, think it's the same as what scoutt is advising you.<br />
<br />
Using height in table cells is causing all your problems (you shouldn’t) and dragging the other columns down. Build the main content of the page in one table, 3 columns wide by 1 row high, insert a table into each of those columns and each columns content will be independent of the other columns. You only need valign=â€Âtop†the main table row then. Whichever column grows longest won’t matter.<br />
<br />
Also, make the middle column stretchy to better accommodate different screen res, width=â€Â*†will make the middle column stretchy. As giz said, fix the errors and shift a lot of the content (text and maybe bgcolor's) over to css in an external style sheet. I’ve used your widths for left and right column only.<br />
<br />
To get your horizontal white lines use a 1x1px transparent gif in a white table row. Stretch the height of the gif for your thickness, not the height of the row or cell.<br />
<br />
<!-- separate table for your head bar here --><br />
<br />
<table width="100%" cellpadding="0" cellspacing="5" border="0"><br />
<tr valign="top"><!-- holds it all at the top --><br />
<td width="175" bgcolor="FFCC66"> <!-- left column table here --></td><br />
<td width="*" bgcolor="#FF9900"> <!-- centre column table here--></td><br />
<td width="200" bgcolor="#CC9900"> <!-- right column table here --></td><br />
</tr><br />
</table><!--content-->Working on the error fixes (some of them aren't mine, they're in the two banners I have on the site). I'm still learning CSS on my lunch hours at work. That's my next project.<br />
<br />
I totally understand how to fix the tables now, though. Thanks so much y'all. I'll post the results soon.<!--content-->Down from 55 errors to 22. You are getting there.<br />
<br />
<br />
All <style> code must be in the <head> section.<br />
<br />
<br />
The <form> ... </form> tags and the missing </table> tag are messing things up as well.<!--content-->Fixed the <style> tags. The <form></form> stuff is in a banner that I didn't do. I know next to nothing about forms. In fact, pretty much all the errors that are left aren't mine. Hooray for me I suppose. <br />
<br />
Except that y'alls some sticklers, and you'll probably call me on some other stuff. But that's what I'm here for.
<!--content-->I'm still nervous about the remaining nesting errors inside the table:<br /><tr> not allowed here and </table> element missing and so on.<!--content-->Yeah, I'm not entirely sure what to do about that. I do so love copy-and-paste code that other people have made.<!--content-->