table render problem

[webnoob]

Hi, i have problems with Internet Explorer waiting for the entire table to load before displaying anything on the page. below is what im using:

<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td width="135"><!-- nav bar with divs --></td>
<td width="7" style="background-image: url('/img/strip.gif');"><!-- empty space --></td>
<td width="100%"><!-- two nested table with a few divs with page content --></td>
</tr>
</table>

there arent a lot of nested tables, just two and they aren't that full of content, this is causing a 2 second delay before being rendered.

I've tried using nested css instead of the table but since the third column has tables it doesn't work very well.. please help.

[BlobFisk]

Welcome to WebmasterWorld, webnoob!

IE waits until it knows everything about the contents of a table before it renders it, this is one of the reasons why CSS is far superior for layout than tables - you don't get this render delay problem.

The best advice that I can suggest is to try to layout your page without using one containing table. Try to split your functional areas up into seperate containers and this should fix this issue.

HTH

[tedster]

Even using divs, background images will usually be the last thing to be rendered so you'll want to take care on "heavy" pages that critical information is not placed in that way.

[Stormfx]

Well, until someone forces browser companies to follow a single standard, divs are for fanatics, IMHO. The only way I can see you making some of the navigation, etc to appear first would be to use more than one table. For example:

<table> 
<tr> 
<td><!-- Background image, nav, etc --></td> 
</tr> 
</table> 
<!-- everything to here is displayed already --> 
<table> 
<tr> 
<td><!-- Content --></td> 
</tr> 
</table>

Of course with your code, it looks like you're using columns, so that won't help much...