293791 - extra column inserted in table

Status: RESOLVED INVALID

(Core :: Layout: Tables, defect)

Description

[David]

User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.7.6) Gecko/20050317 Firefox/1.0.2
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.7.6) Gecko/20050317 Firefox/1.0.2

Developing for IIS ASP.NET; testing pages with Firefox.  Table html/css code
often but not always triggers extra column.  Other pages with very similar code
do not trigger this.  Don't appear to be able to reproduce with static html;
only happens when server side code executing.  Maybe a timing/available text
issue?  It looks like sometimes firefox thinks the colgroup tag signals its own
column (for 3 instead of 2 columns), starts the cells in there, and leaves the
last column empty.  If I add attribute style="width: 30em;" to the colgroup tag,
problem manifests as 30em column with "Add Invoice Item", 10em column with
"Delete Selected", 10em empty column.  The DOM inspector looks reasonable: one
colgroup and one col under it with span 2.  Page info indicates text/html,
Standards compliance mode.

Table code:

<table style="text-align: center;">
<colgroup>
<col span="2" style="width: 10em;"/>
</colgroup>
<tbody>
	<tr>
		<th><a target="_blank"
href="../InvoiceItems/InvoiceItemEdit.aspx?ProjectId=1234&ContractId=1234&InvoiceId=234">Add
Invoice Item</a></th>
		<th><input type="submit" name="SubmitButton" id="SubmitButton" value="Delete
Selected"/></th>
	</tr>
</tbody>
</table>

Relevant css code:

table { border-collapse: collapse; border: solid black 1px; margin-bottom:
0.5em; margin-top: 0.5em; }
tr { height: 1.5em; }
th { border: solid black 1px; font-weight: bold; }
td { border: solid black 1px; }
caption { vertical-align: top; text-align: left; font-weight: bold; }


Reproducible: Sometimes




Default theme, only extension is DictionarySearch 0.7.

Comment 1

[Steve England [:stevee]]

Reporter, could you please attach an .html testcase that shows the behaviour you
describe?
- https://bugzilla.mozilla.org/attachment.cgi?bugid=293791&action=enter
Thanks!

Comment 2

[Nigel Benns]

Attachment: HTML Bug Example: Uses Css (text-align: center;) and div tags. Does not center properly

Comment 3

[Bernd]

why should text-align: align the inner div, it should center the text in the
inner div thats exactly what happens here. Align="center" causes a left and
right auto margin on the inner div and centers the inner div as one would expect.