- From: Daniel Holbert <dholbert@mozilla.com>
- Date: Wed, 11 Feb 2015 16:59:08 -0800
- To: no-cheating@autistici.org, www-style@w3.org
On 02/11/2015 05:20 AM, ... wrote: > I can't see any > connection between justify-content and align-content, though their names > would suggest there is some. There is indeed a strong connection between these properties, as suggested by their names. They're both about "how do I distribute extra space around/between these N <thing>s in this axis?" For justify-content, <thing> is a flex item, and the axis is the main axis. For align-content, <thing> is a flex *line*, and the axis is the cross axis. Note that these properties also take the same values (because they're so analogous). The graphics under the property-descriptions may help, too -- compare the figures at the bottom of these sections (Figure 9 and Figure 11): http://dev.w3.org/csswg/css-flexbox/#justify-content-property http://dev.w3.org/csswg/css-flexbox/#align-content-property "align-items" (which works via influencing "align-self") is somewhat similar, but it's really about "how do I position this **one <thing>** in this axis" -- not N <things>. So, it has a different set of values. Notably, it doesn't take "space-around" / "space-between" (since when there's only one thing, "space-around" is just "center", and there's no concept of "between" at all). Hopefully that clears things up. ~Daniel
Received on Thursday, 12 February 2015 00:59:40 UTC