33988 - Overlapping table cells, simultaneous colspan/rowspan

Status: RESOLVED INVALID

(Core :: Layout: Tables, defect, P3)

Description

[Tristan Zajonc]

From Bugzilla Helper:
User-Agent: Mozilla/5.0 (Windows; U; Win98; en-US; m14)
BuildID:    2000033008

In the page http://www.eactivism.com it appears that the framed based layout has
blown up.

Reproducible: Always
Steps to Reproduce:
1.visit http://www.eactivism.com


Actual Results:  It appears the table based positioning doesn't work correctly.
The blue buttons near the top should all be connected.  Instead it seems as if
some of the table widths are not correctly recognized.  Perhaps it has something
to do with the colspan?

Expected Results:  Both MSIE and Netscape render this page correctly.  What is
fundementally important is that all the buttons on the top connect to each other.	

I'm afraid I don't know what html is causing this problem.  It could be
widespread though since the site was build using Drumbeat 2000.  Although the
html is very ugly, I have not had any problems with other browsers.  I would
imagine that quite a few sites have this problem if they were also built using
db2000.  (Because of this I'm setting severity to major.  Rendering is after all
the most important aspect of a browser)

Comment 1

[[e-mail]]

It looks as if Mozilla is trying to stretch the table to 100% width. I can't
tell why, as the only object with a % width is a horizontal rule. If you resize
the browser the table will follow unless the window is 620 pixels wide (when the
horizontal scroll bar appears) at which point it appears correctly.

Comment 2

[Gervase Markham [:gerv]]

Still a problem in 20000428. Confirming. May well be a dupe.

Gerv

Comment 3

[Eric Pollmann]

This is a table layout issue.  The problem appears to be that db2000 puts out 
some fairly broken table layout markup:

<TABLE>
...
 <TR>
  <TD WIDTH=0 HEIGHT=9></TD>
  <TD></TD>
  <TD VALIGN=TOP WIDTH=239 COLSPAN=8 ROWSPAN=2><IMG Name="Image1_T2" 
SRC="media/logo3.GIF" Width="235" Height="47" Border="0"></TD>
  <TD COLSPAN=2></TD>
 </TR>
...
 <TR>
  <TD WIDTH=0 HEIGHT=30></TD>
  <TD VALIGN=TOP WIDTH=54 COLSPAN=3><A HREF="default.asp"><IMG Name="Home" 
SRC="media/home.gif" ALT="Home" Width="54" Height="18" Border="0"></A></TD>
  <TD VALIGN=TOP WIDTH=56><A HREF="clickcure.asp"><IMG Name="Image1_T3" 
SRC="media/cure.gif" Width="56" Height="18" Border="0"></A></TD>
  <TD VALIGN=TOP WIDTH=73 COLSPAN=4><A HREF="donate.asp"><IMG Name="Donate" 
SRC="media/donate.gif" ALT="Donate" Width="73" Height="18" Border="0"></A></TD>
  <TD VALIGN=TOP WIDTH=78 COLSPAN=3><A HREF="discuss.asp"><IMG Name="Discuss" 
SRC="media/discuss.gif" ALT="Discuss" Width="78" Height="18" 
Border="0"></A></TD>
  <TD VALIGN=TOP WIDTH=87><A HREF="archives.asp"><IMG Name="Archives" 
SRC="media/archives.gif" ALT="Archives" Width="87" Height="18" 
Border="0"></A></TD>
  <TD VALIGN=TOP WIDTH=58 COLSPAN=3><A HREF="links.asp"><IMG Name="Links" 
SRC="media/links.gif" ALT="Links" Width="58" Height="18" Border="0"></A></TD>
  <TD VALIGN=TOP WIDTH=82><A HREF="college.asp"><IMG Name="College" 
SRC="media/college.gif" ALT="College" Width="82" Height="18" 
Border="0"></A></TD>
  <TD VALIGN=TOP WIDTH=152 COLSPAN=2><A HREF="spread.asp"><IMG Name="Spread" 
SRC="media/spread.gif" ALT="Spread the Word" Width="152" Height="18" 
Border="0"></A></TD>
 </TR>
...
</TABLE>

The first row above specifies five columns, but the one below it specifies 13.

Because the "HOME" button in the second row is in a cell that has colspan=3, 
it looks like it's trying to span the three columns logically above it.  One of 
these columns is the "eactivisim.com" image with a width specified at 239.

Handing of to Chris to look at.

Comment 4

[Eric Pollmann]

As if I could count, make that 12 and 19 columns, not 5 and 12.

HOME through DISCUSS buttons span more columns than the eactivism.com image, 
which causes them to spread out when the window is expanded horizontally.

Comment 5

[Bernd Mielke]

the original page went a away, removing URL

Comment 6

[Mats Palmgren (inactive)]

Attachment: Testcase from Eric's markup above

Comment 7

[karnaze (gone)]

Moving to m1.0

Comment 8

[Mats Palmgren (inactive)]

Attachment: Testcase #2

Comment 9

[Mats Palmgren (inactive)]

The real cause of the variyng cell widths seems to be that 2 cells from 
different rows are overlapping. Row 1 rowspan into the area and Row 2 colspan
into the area, see Testcase #2.

Comment 10

[basic]

Attachment: another testcase

Comment 11

[karnaze (gone)]

Attachment: patch to fix the bug (need to run regression tests)

Comment 12

[karnaze (gone)]

Moving this up to m0.9.5 since the patch makes Mozilla handle general colspan 
cells with a width comparable to Nav and IE.

Comment 13

[karnaze (gone)]

reassigning to m0.9.6

Comment 14

[karnaze (gone)]

Removing "patch" keyword which means "Fixes/patches found by individuals without 
direct code check in privileges".

Comment 15

[karnaze (gone)]

Bug 106816 handles the 3rd attachment which is a different problem than the 2nd 
attachment. To fix the 2nd attachment will require a significant change in the 
way we process cells with colspans.

Comment 16

[karnaze (gone)]

Attachment: wip patch

I'm attaching this untested wip patch (developed a long time ago) before I lose
it.

Comment 17

[Nat Goodman]

Hello- I think I've stumbled into this bug, also.  Is there a target fix date?

Here's a little snippet of HTML that doesn't get rendered correctly in version
1.0.3 and 1.3.

<table width="100%" border="1">
<tr><td rowspan="2" colspan="2">1</td><td>5</td></tr>
<tr><td>6</td></tr>
<tr><td>3</td><td rowspan="2" colspan="2">7</td></tr>
<tr><td>4</td></tr></table>

Thanks ery much,
Nat Goodman
[e-mail]

Comment 18

[karnaze (gone)]

mass reassign to default owner

Comment 19

[Boris Zbarsky [:bzbarsky]]

Before we can "fix" this we need to decide on what behavior to go with in this
totally broken case....  Personally, I am inclined to ignore the colspan or
something.

Comment 20

[Mats Palmgren (inactive)]

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

Comment 21

[Yuh-Ruey Chen]

From the dupe:

Although this behavior is fine for HTML, the latest CSS 2.1 draft indicates that
this shouldn't occur in an XHTML document
(http://www.w3.org/TR/2005/WD-CSS21-20050613/tables.html#q7).  Under the diagram
in that section is this: "on the right, the only possible formatting of a
similar XHTML table", which leads me to believe that this section applies to XHTML.

However, the spec is otherwise ambiguous on this matter.  On this page
(http://www.w3.org/TR/2005/WD-CSS21-20050613/images/longdesc/table-overlap-desc.html)
that describes the problem, I don't see any distinction between HTML and XHTML.

Example from the CSS 2.1 spec:
<table>
<tr><td>1</td><td rowspan="2">2</td><td>3</td><td>4</td></tr>
<tr><td colspan="2">5</td></tr>
</table>

Comment 22

[Bernd]

when looking at attachment 2 [details] [diff] [review] it seems pretty reasonable what we do.
This is either WFM or more probably invalid.

Comment 23

[Boris Zbarsky [:bzbarsky]]

As filed, this is invalid.