From Bugzilla Helper: User-Agent: Mozilla/5.0 (Windows; U; WinNT4.0; en-US; rv:1.0rc1) Gecko/20020417 BuildID: 2002041711 When using javascript to alter the 'display' property of certain table elements a few errors result: 1/ First some visual artifacts that are fixed by a resize/redraw 2/ Sometimes the column width and number of columns is calculated incorrectly. 3/ Content that should be displayed outside the table is not displayed anywhere. I have attached some sample code that lets you reassign the display property for any element by id, using some javascript prompts. Reproducible: Always Steps to Reproduce: 1. Start with a standard HTML table. 2. Assign the display of one of its cells to 'inline' 3. Try reverting it back to 'table-cell' Actual Results: 1. Some drawing artifacts, like the table has only half re-rendered. 2. The cells contents are not displayed anywhere on the page. 3. After i resize my browser to get rid of the drawing artifacts, there is a blank hole where td2tr2 was, and td3tr2 stays put. (Interestingly, if you do a text search on the cell contents 'td2tr2', it seems to find the text but nothing gets highlighted.) If I then change the display of td2tr2 back to 'table-cell', it goes back in its correct spot, but td3tr2 has pushed itself over into a new column. Expected Results: As per points in 'Actual Results': 1. It should re-render without any glitches. 2. Normally when extraneous (un-contained) text is found in a table it appears at the top of the table like in the static example I included. This is not such a big thing because the table is badly formed at this point, and handling such errors is anyones guess, but it would be nice if the error handling was consistent. 3.If a cell in the middle of a table suddenly becomes 'not-a-cell' then all the other cells should readjust themselves as though that cell was not there. In my example if you set td2tr2 to 'display:inline' then td3tr2 should take its place, like in the static example. Resetting it's display to 'table-cell' should return return the table to its original configuration. I have recreated this bug using: RC1 on WinNT4 SP6 RC1 on Win2K SP2 0.9.9 on Redhat 7.1 html file to be attached...

This is the file that demonstrates the bug. The bug description won't make much sense without it.

I'm guessing that the frame reconstruction might not be clearing out the anonymous table somehow.

er, anonymous table cell frame.

Confirmed with FizzillaCFM 2002061014.

This shows a common problem with using JavaScript to dynamically change the CSS display property of a table row. It also shows how this problem can be fixed by using the correct CSS display property value.

In regard to the problem with undisplaying a table cell in the middle of a table row with many cells, I would think that a developer might want to actually remove the node of the desired table cell using the DOM API. Then the developer would want to update the colspan attribute of one of the remaining cells in the table using the DOM setAttribute() method in order to set the table structure to a valid state. A table cell could then be re-inserted into the table at the desired location via a DOM method. The attached file should illustrate this approach.

If you look at the source of the following attachment: id=103587 disregard the HTML comment that says, "The bad version".

*** Bug 180258 has been marked as a duplicate of this bug. ***

*** Bug 208888 has been marked as a duplicate of this bug. ***

Fixed by checkin for bug 162063. The tests here were pretty complex in terms of human interaction and such, so I didn't turn them into reftests. Other tests I checked in cover this stuff, though.

Thanks for your work Boris, just donated $20 to the Mozilla Foundation.

Paul, you're very welcome. And thanks for the donation!