- From: Morten Stenshorne <mstensho@opera.com>
- Date: Thu, 03 May 2012 09:29:09 +0200
- To: fantasai <fantasai.lists@inkedblade.net>
- Cc: "www-style\@w3.org" <www-style@w3.org>
fantasai <fantasai.lists@inkedblade.net> writes: > http://www.w3.org/TR/2012/WD-css3-flexbox-20120322/#layout-algorithm > > # Calculate the cross size of each flexbox line. For each flexbox line: > # If the flexbox is single-line and has a definite cross size, the single > # flexbox line's cross size is the cross size of the flexbox's content box. > # End this step of the algorithm. > # [If the flexbox is multi-line, each line is sized to contain its contents.] > > There's an inconsistency between ''nowrap'' flexboxes and ''wrap'' flexboxes > consisting of a flexbox line are laid out due to this difference in how flexbox > lines are sized. The inconsistency can be seen when the flexbox has a definite > cross size and contains an item that is larger than that size: > - in a single-line ''nowrap'' flexbox, the contents are aligned between > the cross-start and cross-end edges of the flexbox; the large item > overflows these alignment bounds > - in a single-line ''wrap'' flexbox, the contents are aligned between > the cross-start and cross-end edges of the large item, overflowing > the flexbox along with the large item. (The flex-line-pack property > then aligns this overflowing line within the flexbox bounds.) > > Is this inconsistency intentional? Or should both ''wrap'' and ''nowrap'' flexbox > lines be sized the same way? > > single-line flexbox with nowrap - > > +----------+ > | | > #================|==========|====================+=========+=# > " [ top-align ] | | | | " > " | centered | | stretch | " > " | | [ bottom-align ] | | " > #================|==========|====================+=========+=# > | | > +----------+ > > single-line flexbox with wrap* - > > [ top-align ] +----------+ +---------+ > | | | | > #================|==========|====================|=========|=# > " | | | | " > " | centered | | stretch | " > " | | | | " > #================|==========|====================|=========|=# > | | | | > +----------+ [ bottom-align ] +---------+ > > * this rendering assumes flex-line-wrap: center; for flex-line-wrap: stretch or start, > shift the flexbox bounds up to align with the top of the centered > item. (flex-line-pack:center, not flex-line-wrap:center, I presume) I'm not sure if I see how this comparison is meaningful, since there are still somewhat meaningless differences between wrappable and non-wrappable flexboxes. flex-line-pack (still) only applies to wrappable flexboxes (well, it says "Applies to: multi-line flexboxes", but I'm pretty that includes wrappable flexboxes that only need one line as well). http://dev.w3.org/csswg/css3-flexbox/#flex-line-pack0 has this note: Note: Only multi-line flexboxes ever have free space in the cross-axis for lines to be aligned in, because in a single-line flexbox the sole line automatically stretches to fill the space. ("multi-line", as in "willing to wrap, if necessary", I presume) That would now be incorrect, since even non-wrappable flexboxes now size their line based on the items' cross size (+ baseline stuff), and there may at least be negative free space. If the line in non-wrappable flexboxes no longer follows the flexbox's cross size strictly, I think flex-line-pack should apply to non-wrappable flexboxes as well, since there may now be negative extra space to distribute (and also positive extra space if the note referred above is removed, to eliminate even more inconsistency). Which brings me to the following question: Why isn't negative line stretching allowed? Negative item stretching is allowed (and it makes a lot of sense). Shouldn't there be a way to make the sole line in a flexbox fit the flexbox's cross size perfectly (by stretching or shrinking the line)? Isn't that use case #1? -- ---- Morten Stenshorne, developer, Opera Software ASA ---- ---- Office: +47 23693206 ---- Cellular: +47 93440112 ---- ------------------ http://www.opera.com/ -----------------
Received on Thursday, 3 May 2012 07:30:21 UTC