720669 - max-width on image in tables inside CSS3 columns is not respected

Status: UNCONFIRMED

(Core :: Layout, defect)

Description

[Oliver Kohll]

Attachment: max_width_issue.html

User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_7_2) AppleWebKit/534.52.7 (KHTML, like Gecko) Version/5.1.2 Safari/534.52.7

Steps to reproduce:

See attached HTML.

Created a two column layout with -moz-column-count: 2
Put a table width=100% in it.
Placed an image in the table that was wider than the column width chosen by the browser
Assigned max-width:100% to the image


Actual results:

The image continued to overflow the column horizontally


Expected results:

The image should have been resized to constrain it to 100% of the column width.

This does seem quite an edge case but I'm getting bitten by it. Note I'm only using the table around the image because of bug 549114 - see

https://bugzilla.mozilla.org/show_bug.cgi?id=549114#c4

so that would be the priority for me.

Comment 1

[Tim (fmdeveloper)]

Confirmed on Mozilla/5.0 (Windows NT 5.1; rv:12.0a1) Gecko/20120123 Firefox/12.0a1 ID:20120123095741

Comment 2

[Boris Zbarsky [:bzbarsky]]

I'm not sure where the expected results are coming from.  "width:100%" on a table doesn't actually make it the width of the container.  In particular, tables never shrink below their min-intrinsic width.  If you take out the column style and just set the div to "width:400px" you get the same overflowing behavior in Opera (but not WebKit).

Of course the spec doesn't define width computation for auto-layout tables.  It also doesn't define min-intrinsic width computations, so the only constraint on table width algorithms is existing web site compat.

David, would it make any sense to set the min-intrinsic width to something other than the intrinsic width for replaced elements with a percentage max-width?

Comment 3

[David Baron :dbaron: (⌚️UTC-4, no longer working on Mozilla)]

I'm not so sure this is a bug.

The image is constrained to be at most 100% of the width of the cell.

The table is specified to be 100% of the width of its containing block, but tables are never smaller than their minimum intrinsic width.

It's not clear to me how the max-width on the image inside of the cell is supposed to suppress or affect the image's effect on the intrinsic minimum width of the table.

Comment 4

[David Baron :dbaron: (⌚️UTC-4, no longer working on Mozilla)]

Also, are the columns actually a necessary part of the testcase?  I'd think you'd get the same result without multicolumn.

Comment 5

[Boris Zbarsky [:bzbarsky]]

> It's not clear to me how the max-width on the image inside of the cell is supposed to
> suppress or affect the image's effect on the intrinsic minimum width of the table.

Yes, exactly.  It looks like we and Presto do the same thing; WebKit does something else.  I don't have Trident on hand right now.

> Also, are the columns actually a necessary part of the testcase? 

No.  See the last sentence of comment 2 paragraph 1.  All the columns are doing is creating a containing block for that table that's narrower than the image.

Comment 6

[Oliver Kohll]

OK, if it's not a bug I'll just add a comment to bug 549114 to note that the workaround of wrapping a table around content to avoid column breaks within content has a problem with this case. That's what I was doing when I found this issue.

Comment 7

[dolphinling]

Dupe of bug 434230?