302113 - Generic Block Inside Anonymous Table Cell When "Display" is Toggled

Status: RESOLVED FIXED

(Core :: Layout: Tables, defect)

Description

[Jon Barnett]

User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.7.10) Gecko/20050716 Firefox/1.0.6 (ax)
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.7.10) Gecko/20050716 Firefox/1.0.6 (ax)

This is hard to explain - forgive me if I do poorly.

http://www.w3.org/TR/CSS21/tables.html#anonymous-boxes 
#7 in the list at that page of the CSS 2.1 documentation says:
-quote- If a child T of a 'table-row' box P is not a 'table-cell' box, a box
corresponding to a 'table-cell' element will be generated between P and T. This
box spans all consecutive siblings of T that are not 'table-cell' boxes. -end quote-

In my test case, I used DIV elements to prevent confusion.  This is a CSS issue,
not an HTML issue.  I have used DIVs to create a two-row, five-column table. 
There is a generic block level element (#genericblock) directly inside the
second row ([@class='mytablerow']).  The generic block is directly inside the
table row and not inside a table-cell, where it should be.  As required by CSS
2.1, Gecko creates an anonymous table-cell that holds #genericblock.  

Using JavaScript, I change the "display" property of that block back and forth
between "block" and "none".  When the "display" is changed to "none", the block
goes away as it should.

When you change the "display" back to "block", the block is no longer inside its
old anonymous table cell in the first column.  It is now inside a new anonymous
table cell in the second column.  This is the bug.

Toggling the block's "display" property will continue to move the block a column
at a time to the right.  Eventually the block appears to stay in the sixth
column in my example.  Actually, these anonymous table cells are created ad
infinitum, but they are empty and do not take up visible space.



Reproducible: Always

Steps to Reproduce:
1.Visit the URL with the test case:
http://www.websandbox.net/example.php/id/15 
2.Click the Toggle button.  The block disappears.
3.Click the Toggle button again.  The block re-appears in another column.

Actual Results:  
The block is moved out of its original anonymous table cell and into a new
anonymous table cell next to the old one.

Expected Results:  
The block should stay in the first column.

The workaround, as an author, is to not depend on the browser to create the
anonymous table-cell.  The author should create the table-cell manually.

The problem can be recreated just as easily using TABLE, TR, and TD elements.
I discovered this problem in this Mozillazine thread:
http://forums.mozillazine.org/viewtopic.php?t=296502
The poster of that thread was setting a TD element's "display" property back and
forth between "block" and "none" and experienced the problem I described.

Comment 1

[Steve England [:stevee]]

Attachment: reporter's testcase from URL

Mozilla/5.0 (Windows; U; Windows NT 5.0; en-US; rv:1.8b4) Gecko/20050725
Firefox/1.0+ ID:2005072515
I see the described behaviour.

Comment 2

[Boris Zbarsky [:bzbarsky]]

This is basically bug 148810

Comment 3

[Boris Zbarsky [:bzbarsky]]

Actually, I was wrong.  This got fixed by the fix for bug 162063.

I pushed the test as http://hg.mozilla.org/mozilla-central/rev/6cfd9a6df378