- From: Boris Zbarsky <bzbarsky@MIT.EDU>
- Date: Sat, 25 Sep 2010 04:44:31 -0400
- To: Anton Prowse <prowse@moonhenge.net>
- CC: "www-style@w3.org list" <www-style@w3.org>
On 9/25/10 4:19 AM, Anton Prowse wrote: > Indeed. (Which happens to be 1/4 of its intrinsic width.) That's an accident of this testcase, caused by the orange square block having a width which is exactly half the intrinsic width of the image. > Because in the cases where the layout is defined, that's what's required: > > HTML4: "Note that lengths expressed as percentages are based on the > horizontal or vertical space currently available, not on the natural > size of the image, object, or applet." > > CSS21: "The percentage is calculated with respect to the width of the > generated box's containing block." (No mention of intrinsic width.) Of course. Percentages are percentages of the parent, period. It's just that in this case the parent's width depends on the widths of its kids.... and in THAT case its with will in general depend on intrinsic widths of its kids. Just take the % width styling out to see that effect. >> The only question is whether the width >> of the shrink-wrapping container is 96px or 48px. The browsers that make >> it 96px use the intrinsic width of the image to make that determination. > > The intrinsic width of the image is 96px, so there's a pretty good > argument for keeping the image at its intrinsic width of 96px and then > making the container 192px wide. That's not workable once the container has more than one %-width child, though. Though this is similar to what Gecko does for blocks with percentage margins and fixed widths that have shrink-to-fit parents.... > UAs which make the image 48px wide and the container 96px wide seem to > be applying the 50% in two different ways simultaneously: once for the > width of the image and then again for the width of the container. Uh... no. They're simply ignoring the percentage width style completely when determining the intrinsic width of the container, then applying it when determining the width of the kid. That's what Gecko does, at least. For what it's worth, I'm finding it hard to believe that both behaviors are equally web-compatible... but maybe websites don't use markup like this. -Boris
Received on Saturday, 25 September 2010 08:45:08 UTC