- From: fantasai <fantasai.lists@inkedblade.net>
- Date: Tue, 28 Jul 2015 11:25:31 -0400
- To: www-style@w3.org
On 07/27/2015 05:12 PM, Javier Fernandez wrote: > Hi, > > I'm not sure whether I understand the difference between the new values > provided by the CSS Box Alignment spec when applied to Flexbox layout. > > * align-self: > - The align-self property applies along the flexbox’s cross axis. > - The alignment container is the flex line the item is in. > - The alignment subject is the flex item’s margin box. > > * start: > - Aligns the alignment subject to be flush with the alignment > container’s start edge. > * self-start: > - Aligns the alignment subject to be flush with the edge of the > alignment container corresponding to the alignment subject’s start side. > * flex-start: > - Aligns the alignment subject to be flush with the edge of the > alignment container corresponding to the flex container’s main-start or > cross-start side, as appropriate. This will always be the cross-start side, since align-self operates in the cross dimension. > Since align-self applies along the cross axis, I assume that container’s > start edge, being the container the flex line, will be the same than the > cross-start side, independently of the flex-flow value or the > writing-mode. I understand that both, start and flex-start produce > always the same results. am I right on this assumption ? No, not correct. For align-self, * flex-start/flex-end depend on flex-wrap of the container * start/end depend on writing-mode of the container * self-start/self-end depend on writing-mode of the item If flex-wrap is wrap-reverse, then the start and flex-end alignments will be identical, and start/flex-start will be opposite. > Another doubt I have is how to deal with self-start and orthogonal > flows. I think it d be something similar to what happens in Grid Layout, > hence orthogonal flows lead to self-start equivalent to start and > flex-start. Only when using parallel flows, but opposite directions the > result of self-start would imply any difference. No, when determining start/end (or self-start/self-end) you always use the writing mode. It may vary whether you are mapping using the block axis directions or the inline axis directions, but you are mapping against the writing mode in one of those directions. For example, if we have a vertical-rl ltr item, its start sides are the top and the right, and the end sides are the bottom and left. If the cross axis is vertical, the align-item: self-start aligns to the right. If the cross axis is horizontal, self-start aligns to the top. Does that make sense? ~fantasai
Received on Tuesday, 28 July 2015 15:29:37 UTC