W3C home > Mailing lists > Public > www-style@w3.org > February 2013

Re: [css3-sizing] intrinsic widths of replaced elements inside flexboxes

From: Boris Zbarsky <bzbarsky@MIT.EDU>
Date: Tue, 12 Feb 2013 20:56:09 -0500
Message-ID: <511AF2B9.1080701@mit.edu>
To: www-style@w3.org
On 2/12/13 7:13 PM, Ojan Vafai wrote:
> Also, this quirk only applies to percentage width, not percentage
> min-width/max-width (e.g. <img style="min-width: 100%"> does not apply
> this quirk).

As far as I know, WebKit does things similar to what you describe for 
"max-width: 100%".  See, for example, WebKit's behavior on the testcases 
in https://bugzilla.mozilla.org/show_bug.cgi?id=823483

> There's a bit of an obscure quirk on the intrinsic size of replaced
> elements with a percentage width. Their min content measure is set to 0.

It's not clear to me that this is a "quirk".  It's fairly sensible 
behavior given what the min content measure means, really.

> I'm pretty sure web content relies on this.

It does, indeed.

> Second, Gecko and WebKit also apply this quirk to replaced elements
> inside flexboxes, Opera does not. None of Gecko, WebKit, Opera or IE
> apply this quirk to replaced elements anywhere else as best I can tell

Gecko's behavior here is identical for floats, fieldsets, flexboxes, 
asbpos, flexboxes, buttons, table cells, etc.  It's all the same 
shrink-wrapping code.

> As such, it
> seems to me like we should match the Opera behavior and limit this
> behavior to replaced elements inside table cells.

Why?

> Apologies in advance if I confused any of the compat testing for this.
>
> http://jsfiddle.net/tEZcS/

Most of the tests in here have no constraint that would cause them to go 
below their max-intrinsic width, so it doesn't matter what the 
min-intrinsic width is.

Try sticking a <body style="width:0; position: relative"> at the 
beginning of your HTML.

-Boris
Received on Wednesday, 13 February 2013 01:56:39 GMT

This archive was generated by hypermail 2.3.1 : Tuesday, 26 March 2013 17:21:05 GMT