From: Boris Zbarsky <bzbarsky@MIT.EDU>

Date: Wed, 11 Oct 2006 15:39:41 -0500

Message-ID: <452D568D.2090704@mit.edu>

To: Allan Sandfeld Jensen <kde@carewolf.com>

CC: www-style@w3.org

Date: Wed, 11 Oct 2006 15:39:41 -0500

Message-ID: <452D568D.2090704@mit.edu>

To: Allan Sandfeld Jensen <kde@carewolf.com>

CC: www-style@w3.org

Allan Sandfeld Jensen wrote: > CSS 2.1 #10.5: "<percentage> Specifies a percentage height. The percentage is > calculated with respect to the height of the generated box's containing > block. If the height of the containing block is not specified explicitly > (i.e., it depends on content height), and this element is not absolutely > positioned, the value computes to 'auto'. " I've always wondered about this a little bit, especially in light of the following text under <http://www.w3.org/TR/CSS21/visudet.html#min-max-heights>: The following algorithm describes how the two properties influence the computed value of the 'height' property: 1. The tentative used height is calculated (without 'min-height' and 'max-height') following the rules under "Calculating heights and margins" above. 2. If this tentative height is greater than 'max-height', the rules above are applied again, but this time using the value of 'max-height' as the computed value for 'height'. 3. If the resulting height is smaller than 'min-height', the rules above are applied again, but this time using the value of 'min-height' as the computed value for 'height'. > but if you have: > > .parent { min-height: 100px } > .child { height: 50% } > > What is the effect on .child? The way I'd always read the spec part I quoted above in this scenario is: 1) Apply section 10.6.3 to the parent with "height: auto" for the parent. 2) Apply section 10.6.3 to the child. End up with a computed height of "auto" for the child. 3) Determine the resulting child's height and hence parent's height. 4) If the resulting parent's height is >= 100px, we are done. 5) Otherwise, apply section 10.6.3 to the parent with a computed height of "100px" for the parent. 6) Apply section 10.6.3 to the child. End up with a computed height of "50px" for the child. Done. This setup has two drawbacks, in my opinion. First of all, having to perform those two reflow passes on the kids of the parent is a little unfortunate (highly amenable to exponential growth in the tree depth). Secondly, the resulting height of the child is discontinuous: if the "intrinsic" height of the child is 99px, the child ends up 50px tall, but if it's 100px, the child ends up 100px tall. Of course there are other discontinuous algorithms in the CSS spec... (say margin-collapsing). -BorisReceived on Wednesday, 11 October 2006 20:40:02 GMT

*
This archive was generated by hypermail 2.2.0+W3C-0.50
: Monday, 27 April 2009 13:54:47 GMT
*