table collapse, or size is changing during the rendering of browser..


I have an html page which is rendered in .NET. The thing is in ie and chrome, when the table is loaded, it has a slight change in collapse as the size is moving (as if a cat is vomiting a last tar ball) and shows it properly in the end but it loses time to do.

What to do? Which css causes for this table behaviour?

LVL 12
Who is Participating?
skullnobrainsConnect With a Mentor Commented:
i have no idea about the language you use, but basically in pseudo-code assuming + stands for concatenation of strings

while get_next_row()
  buff = buff + "<tr><td>....</tr>"
print buff + "</table>"
Alexandre SimõesManager / Technology SpecialistCommented:
Man... what on earth does a cat vomiting a tar ball have to do with an HTML table? :)

I have no clue about what you're talking about.
Do you have an example?
Chris StanyonCommented:
We're going to need to see this in action - a link to a demo of your problem would be ideal...
Easily Design & Build Your Next Website

Squarespace’s all-in-one platform gives you everything you need to express yourself creatively online, whether it is with a domain, website, or online store. Get started with your free trial today, and when ready, take 10% off your first purchase with offer code 'EXPERTS'.

jazzIIIloveAuthor Commented:
ah, i solved i think. Thanks. What I have done is i assign a fixed width in td. Is this OK for different resolutions?

I cannot share a link or code since it's not public..

Alexandre SimõesManager / Technology SpecialistCommented:
well... I have no clue about what you're doing but if you assign a fixed width it's most certain that it's not OK for different resolutions...

What makes the cat vomit, the content or the parent?
If it's the content, setting the width to 100% will solve...
If it's the parent you can also try to set the table itself to 100% avoiding it to resize if the content changes.

But anyway, with your information I'm just shooting in the dark here... :)
I suspect you are trying to manage layout with a table.  If that is the case then you will run into all kinds of problems trying to maintain it.  Tables are for the presentation of tabular data. Using them for anything else invites problems.  As for sizing, the table structure will adjusted to content and may sometimes ignore diminsions set in code.

actually it does solve such problems in cases due to the browser rendering the table before it gets all the rows. every time a cell is wider than all the above cells in the same column, the whole rendering changes. it was common to use the <rows> tags to solve this problem before css existed.

another way to get a better rendering consists in using buffering on the server. most likely this happens because the server takes a long time to compute the rows and the client receives them in chunks. generate the whole table before you send any output to the browser and you should not run into this problem any more either

with your solution in many cases you can identify only some rows that need to have a fixed width so you probably should not give widths to all of them

++ to the above restriction and espetially @cd's related to using tables for general layout if that is indeed what you are doing

@alexcode : using 100% width for tables is asking for trouble in most cases because the columns are not required to fill the table container
jazzIIIloveAuthor Commented:
Hi guys;


>>most likely this happens because the server takes a long time to compute the rows and the client receives them in chunks.


>> generate the whole table before you send any output to the browser and you should not run into this problem any more either

but i populate the rows of table during generation of table. I mean how can i generate the table totally before sending data? Can you elaborate?
either buffering is available in .NET or you can simply store the generated table into a variable and echo the whole thing in one go.

if it is really too long and you want some output to be visible before you have the whole thing,
- you may echo whatever number of row were computed every 2 seconds for example
- you may want to display the whole page and fill in the rows using ajax. like before, you can handle chunks sizes as you see fit. you may even implement scrolling in ajax.
- you can mix both the above by generating the whole layout, end then generating some js code that adds chunks of rows in the existing array
jazzIIIloveAuthor Commented:

great, any code examples for this?
how can i store the table in a variable? A simple code would suffice, i guess.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.