46 line script uglying itself. why?

Anon

What I'm trying to accomplish is have along the right side of the page a summary of all the material in the various sections of the website. I'm trying to do this by having one table for each section, each containing two rows - one for title, and one for the summary. This might sound a bit confusing, but run the code I made and you'll see quickly what I'm trying to do.

The issue with it (at least in Internet explorer) is that for whatever reason, it's overlapping the tables. Sort of like it's sticking the second table on there before it waits to see how big the first one is going to be. I noticed this was happening in another script I tried using functions and tables as well and I really don't understand it. Why is this happening? Is there a way around it?

i know I could do this without php and functions and stuff, but I'm really starting to enjoy this stuff! It's so flexible it's great.

<?php

function righttable($righttitle,$righttext)
{echo "

<p>
<table width=180 border=0 cellspacing=0 cellpadding=1 align=right>
<tr>
<td bgcolor=#555555>
<table width=178 border=0 cellspacing=0 cellpadding=2>
<tr>
<td bgcolor=#555555>
<font face=\"Verdana, Arial, Helvetica, sans-serif\" size=2 color=#000000><b>$righttitle</b></font></td>
</tr>
<tr>
<td bgcolor=#000000>
<font face=\"Arial, Helvetica, sans-serif\" size=2 color=#FFFFFF>$righttext</font></td>
</tr>
</table>
</td>
</tr>
</table>
</p>

"; }

<p>
<?php
righttable("section 1", "this is where i would say what section 1 of the page is about");

righttable("section 2", "here is where I would say what section 2 of the page is about, etc");
?>
</p>

</td>

</tr>
</table>

rrijnders

I have run in to this before. The problem is with the way that IE renders (what I call) buttressed tables. This is when you have one table right above another or one table right next to another with nothing in between them. IE just won't do it.

This has nothing to do with PHP, by the way.

In your script, put something between the tables, even if it is just a clear gif or blank space:

===================
righttable("section 1", "this is where i would say what section 1 of the page is about");

<b>print "<br>&nbsp_;<br>";</b>

righttable("section 2", "here is where I would say what section 2 of the page is about, etc");

HTH
-- Rich

Anon

Thanks, but what you suggested only works if I put enough <br> 's to push the second table below the first. For example, if the first table is 6 lines, I have to put 6 <br> 's or the second table still overlaps and I really don't want to have to be monitoring how many <br>'s I'm putting in there. Any other suggestions? Anyone?

Anon

I rewrote it essentially just using a different table organization and now it works just right. I don't frankly understand why and would really like to. What was wrong with the first one that's different here? Any guesses?

Thanks,
Mike

<?php

function righttable($righttitle,$righttext)
{echo "
<tr>
<td bgcolor=#555555>
<font face=\"Verdana, Arial, Helvetica, sans-serif\" size=2 color=#000000><b>$righttitle</b></font>
<table width=178 border=0 cellspacing=0 cellpadding=2>
<tr>
<td bgcolor=#000000>
<font face=\"Arial, Helvetica, sans-serif\" size=2 color=#FFFFFF>$righttext</font>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td bgcolor=#FFFFFF>
 
</td>
</tr>
"; }

<?php
righttable("section 1", "this is where i would say what section 1 of the kfd;ls kd;lsk fdsl; page is about");

righttable("section 2", "here is where I would say what section 2 of the page is about, etc");
?>

</table>
</p>

rrijnders

What you did here is essentially nest all your tables inside one big table, which goes around the problem of having two or more tables next to each other (without an outer table).

I do the same thing many times. In fact, most of my page designs end up having one big table for the whole page and then everything else in their own tables inside the big table. This method works, but has one major drawback: Most browsers will not display a section of a page until the outermost container is resolved. That means that the whole page will not display until everything inside the outermost table has been internally rendered. In otherwords, the visitor stares at a blank browser screen until every image and icon inside the table is downloaded and rendered. (You can keep the browser from waiting for image downloads by making sure to always use the <i>height</i> and <i>width</i> attributes for images, but that's another story.)

If you do it your original way, then pages will display in sections. As each table's contents are rendered, they will appear in the browser. This gives visitors something to look at while the rest of the page is still loading, BUT you have the problem created by the tables being next to each other or on top of one another.

I have never gotten a satisfactory reason from the IE boards about why IE does this. (Mozilla does not have a problem with tables this way). In fact, different versions of IE have different versions of this (what I consider it) bug. The version of IE that I have and used to view your code, did not overlap the tables, it just failed to display the first table all-together. Putting in one "<br>" and an "n_b_s_p_;" (blank space) fixed the problem in my version if IE, but you say that it only shifts the table down by one line in your version of IE.

Well, that's micro$$oft for you. As you can plainly see with your simple 41 lines of html, there is no problem with the HTML itself. Mozilla, Netscape, and Konqueror have no problems with it.

Keep the old addage in mind:
"Write once, test everywhere and often"

-- Rich