Replacing 6.3.2 Variable Dimension Computation Rules #################################################### Second revision. Simon Sapin, 2012-07-02 Introduction ============ I argue that the current rules in section 6.3.2[1] of the current Editor’s Draft for css3-page are unreasonably hard to implement, under-specified and not even sufficient for the desired behavior. More background was posted on www-style[2]. [1] http://dev.w3.org/csswg/css3-page/#margin-constraints [2] http://lists.w3.org/Archives/Public/www-style/2012Jun/0184.html Proposed replacement ==================== Even without the quadratic stuff, what the current spec tries to do with 'auto' margins is still very complicated. 9 properties that may or may not be 'auto' yield a lot of combinations. Therefore, I suggest the following rule: | If the margin-left or margin-right property of any of the | three boxes computes to 'auto', the used value is zero. It *is* a loss a functionality, but I think the trade-off is worth it. This change is essential in my proposal, which is still nowhere near Fixed Dimension Computation Rules’s simplicity. Remember that this is three simple boxes with (most often) very small texts. Any fancy layout is probably overkill. Other than that, a side effect is that margin boxes with 'width: auto' will never grow larger than their preferred width. I don’t know if this is a problem; authors can always use percentage widths if 'auto' does not give the desired behavior. Indentation matters in the algorithm below. I don’t know if there is a way to reduce nesting while keeping the text unambiguous. ===== Start of proposed text ===== 6.3.2. Margin Box Variable Dimension Computation Rules The following rules apply to ‘top-left’, ‘top-center’ and ‘top-right’ margin boxes, which are referred to in this section as A, B, and C, respectively. If the margin-left or margin-right property of any of the three boxes computes to 'auto', the used value is zero. The width of the containing block is known at this point, so percentages can be resolved. Only the used values for 'auto' widths remain to be determined. Definitions: *preferred outer width* of a box If width is 'auto', the preferred width plus left and right margins, borders and padding. Otherwise, the outer width. *preferred minimum outer width* of a box If width is 'auto', the preferred minimum width plus left and right margins, borders and padding. Otherwise, the outer width. Algorithm: * If B is not generated * If both A’s and C’s widths are 'auto' * If the sum of their preferred outer widths is less than or equal to the width of the containing block, their used width are their respective preferred widths. * Otherwise, * The remaining width is the containing block’s with minus A’s and C’s outer preferred minimum widths. * If the remaining width is negative or zero, the used widths for A and C are their respective preferred minimum widths. * Otherwise, * The respective weights for A and C are the preferred width minus the preferred minimum width * The respective used widths for A and C are: preferred minimum width + (remaining width * weight / sum of both weights) (In other words, the preferred minimum widths are increased by distributing the remaining width proportionally to the weights.) Note: weights by definition can not be negative, and this rule only applies when at least one of them is greater than zero: this rule never needs to divide by zero. * Otherwise, if A’s width is 'auto', its used width is the "shrink-to-fit" width with the available width set to: * the containing block’s width * minus the C’s outer width * minus the A’s own margins, borders and padding * Otherwise, if C’s width is 'auto', its used width is the "shrink-to-fit" width with the available width set to: * the containing block’s width * minus the A’s outer width * minus the C’s own margins, borders and padding * Otherwise (if B *is* generated) * If B’s width is 'auto' * Define AC-minimum as twice the greater of A’s and C’s preferred minimum outer width, and AC-preferred as twice the greater of their preferred outer width. * If B’s preferred minimum outer width plus AC-minimum is greater than the width of the containing block, the used width for B is its preferred minimum width. * Otherwise, * The remaining width is the containing block’s with minus AC-minimum minus B’s outer preferred minimum width. * If the remaining width is negative or zero, the used widths for B is the preferred minimum width. * Otherwise, * The weight for B is its preferred width minus its preferred minimum width. The weight for AC is AC-preferred minus AC-minimum. * The used width for B is: preferred minimum width + (remaining width * weight / sum of both weights) (In other words, the preferred minimum width is increased by a portion of the remaining width proportional to the relative weight.) Note: weights by definition can not be negative, and this rule only applies when at least one of them is greater than zero: this rule never needs to divide by zero. * If A’s width is 'auto', the used width is the "shrink-to-fit" width with the available width set to: * half of the containing block’s width * minus half of the outer width of B. * minus the A’s own margins, borders and padding * If C’s width is 'auto', the used width is the "shrink-to-fit" width with the available width set to: * half of the containing block’s width * minus half of the outer width of B. * minus the C’s own margins, borders and padding Now that all three boxes have a determined outer width, they are positioned so that: * The left outer edge of A is flush with the left edge of the containing block * The outer area of B is centered in the containing block. * The right outer edge of C is flush with the right edge of the containing block. Note: if the boxes have large preferred minimum width, they may end up overlapping each other. ===== End of proposed text ===== The note on negative widths and what follows (how the rules translate for margin boxes on the bottom, left and right sides) are kept as-is. A, B and C could be replaced by "the {left,center,right} box" in the text, whichever is a better style.