Rendering problem with nested HTML tables (perfomance)

Does anyone have experience with rende开发者_如何学Cring nested HTML tables? I am attempting to render 30 - 40 rows that each have 5 tables in them. This renders very slowly in Internet Explorer 7 and 8. Is there a trick I can use to speed my table rendering up? Is there a different element I can use other than tables?

if you are working with a nested structure that bad, I would guess that there are ways that it could be refactored to not be as complex, and your performance gain is going to be great by doing so.

However, we would need to see exactly what you are doing to give a valid answer.

30-40 tables is a lot of code to render. You should definitely switch to CSS layouts.

Setting explicit height and width on every element in the tables will improve browser layout performance.

For internet explorer, see http://msdn.microsoft.com/en-us/library/ms531161(VS.85).aspx

Setting the property to fixed significantly improves table rendering speed, particularly for longer tables. Setting row height further improves rendering speed, again enabling the browser's parser to begin rendering the row without examining the content of each cell in the row to determine row height.

Tables are good for grids of information. For most other applications use a styled unordered list UL.

Add:

table
{
    table-layout: fixed;
}

Be aware: some text may flow out of the table cells now.