W3C home > Mailing lists > Public > www-style@w3.org > July 2014

[css-flexbox] Meaning of "any definite size constraints in the opposite dimension", for resolving min-width:auto/min-height:auto

From: Daniel Holbert <dholbert@mozilla.com>
Date: Thu, 03 Jul 2014 14:19:27 -0700
Message-ID: <53B5C8DF.8010708@mozilla.com>
To: www-style <www-style@w3.org>
Hi Tab & fantasai,

I want to sanity-check my understanding of this spec-text:

#  [min-width:auto] specifies as the minimum size the
#  smallest of:
#    * [SNIP -- various other candidate min-size values]
#    * if the item has an intrinsic aspect ratio, the
#    width (height) calculated from the aspect ratio
#    and any definite size constraints in the opposite
#    dimension
http://dev.w3.org/csswg/css-flexbox/#valuedef-auto0

I want to make sure I'm correctly understanding what candidate min-size
should be generated by that last bullet-point, and in particular, what
"any definite size constraints" actually translates to here.

EXAMPLES
========
To make things concrete: what candidate min-size would that bullet-point
generate, in a horizontal single-line flex container, for a flex item
with...
 (A) ...a 1:1 ratio and "min-height: 5px; height: 10px"?

 (B) ...a 1:1 ratio and "min-height: 20px; height: 10px"?

 (C) ...a 1:1 ratio and "min-height:5px; height: auto"?

 (D) ...a 1:1 ratio and "min-height:5px; height:auto;
align-self:stretch" and a fixed "height:15px" on the container?

 (E) ...a 1:1 ratio and "min-height:20px; height:auto;
align-self:stretch" and a fixed "height:15px" on the container?


I think the candidate min-width values there (produced by this bullet
point) would be:
 (A) 10px  (from item's 'height')
 (B) 20px  (from item's 'min-height'-clamped 'height')
 (C) 5px   (from item's 'min-height')
 (D) 15px  (from container's imposed 'height')
 (E) 20px  (from container's imposed 'height', clamped to item's
'min-height')

REASONING
=========
I'm assuming that this bullet-point means, for flex items w/ an aspect
ratio:
 - IF the flex item has a definite cross size (which might be imposed by
the flex container, as in (D) and (E)), then use that (combined with its
ratio) to compute the candidate min-main-size for this bullet-point.

 - ELSE, use the cross-axis min-size property (combined with the ratio)
to compute the candidate min-main-size for this bullet-point.

Is that right?

Thanks,
~Daniel
Received on Thursday, 3 July 2014 21:19:55 UTC

This archive was generated by hypermail 2.3.1 : Monday, 2 May 2016 14:39:23 UTC