Closed Bug 360065 Opened 18 years ago Closed 18 years ago

[reflow branch] Incorrect layout of deviantArt galleries


(Core :: Layout: Tables, defect)

Not set





(Reporter: swansontec, Assigned: bzbarsky)




(Keywords: testcase, top100)


(4 files, 1 obsolete file)

User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 6.0; en-US; rv:1.9a1) Gecko/20061107 Minefield/3.0a1
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 6.0; en-US; rv:1.9a1) Gecko/20061107 Minefield/3.0a1

The image galleries do not display properly on the reflow branch. The first image appears in the correct location, but the remaining images pile up off the edge of the screen. On the trunk builds, the image appear next to each other in several rows.

Reproducible: Always

Steps to Reproduce:
1. Visit any gallery page at using the latest reflow branch build. would work.
Actual Results:  
All the images except the first one appear piled up on the edge of the gallery.

Expected Results:  
The images appear next to each other in multiple columns and multiple rows.

The deviantArt galleries use a <span> with {display: table-cell; width: 205px;} inside a <div> with {display: inline;}. For some reason, the width of the <div> is the width of its parent, rather than the 205px width of its content. This forces the remaining gallery images over the edge.
Ever confirmed: true
The front page is also affected so changing URL to
(which is #63 on Alexa's Top100 English site list)
Keywords: top100
OS: Windows XP → All
Hardware: PC → All
It looks like a table related problem:

TableOuter(div)(1)@0xf1aa30 {0,-14,8400,560} ... pst=:-moz-table-outer<
  Table(div)(1)@0xf1aab0 {0,0,2688,560} ... pst=:-moz-table<

The outer table frame should have the width of the inner in this case, yes?
Component: Layout: Block and Inline → Layout: Tables
QA Contact: layout.block-and-inline → layout.tables
So the basic problem is that this is falling into the case described by roc in bug 297537 comment 8 and going forward.

So when we call ComputeSize, aShrinkWrap is false (since the table is a block-level as far as the reflow state is concerned).

I suppose we could add a nasty hack here for the time being, until we actually implement inline table properly....
Attachment #245811 - Flags: superreview?(dbaron)
Attachment #245811 - Flags: review?(dbaron)
The other option is to put the nasty hack into nsTableOuterFrame, of course.
Attachment #245811 - Flags: superreview?(dbaron)
Attachment #245811 - Flags: superreview+
Attachment #245811 - Flags: review?(dbaron)
Attachment #245811 - Flags: review+
Attached patch reftest for this (obsolete) — Splinter Review
Attachment #246099 - Flags: review?(dbaron)
Fixed on reflow branch; filed bug 361352 on fixing this the "right" way with inline-table.
Closed: 18 years ago
Resolution: --- → FIXED
Attached patch Merged reftestSplinter Review
Attachment #246099 - Attachment is obsolete: true
Attachment #247933 - Flags: review?(dbaron)
Attachment #246099 - Flags: review?(dbaron)
Comment on attachment 247933 [details] [diff] [review]
Merged reftest

Probably better to use blue/purple rather than red/green (which imply fail/pass). 

Attachment #247933 - Flags: review?(dbaron) → review+
Checked in the test with that change.
Flags: in-testsuite+
Er, actually, shouldn't the test be marked as passing now that it passes?  (I just got an "UNEXPECTED PASS" on this test.)
Er... it's not guaranteed to pass until we implement inline-table.  It would certainly have failed on my machine -- the vertical positioning was different by 1-2 pixels between the test and the ref.

Maybe we should comment the test out until inline-table works.
Oh, I was testing in my tree where I'm implementing inline-table. :-)
Assignee: nobody → bzbarsky
You need to log in before you can comment on or make changes to this bug.