W3C home > Mailing lists > Public > www-style@w3.org > January 2015

Re: [css-grid][css-align] self-start and self-end alignment with orthogonal flows.

From: Tab Atkins Jr. <jackalmage@gmail.com>
Date: Fri, 9 Jan 2015 13:16:03 -0800
Message-ID: <CAAWBYDCqrdouJZC68fnDDv6NMHGa80XCSzUu5RUKJ3wzT2nJLg@mail.gmail.com>
To: Javier Fernandez <jfernandez@igalia.com>
Cc: www-style list <www-style@w3.org>
On Fri, Jan 9, 2015 at 7:44 AM, Javier Fernandez <jfernandez@igalia.com> wrote:
> I have some doubts about how to implement the Self Alignment properties
> when using orthogonal flows and the property values are self-start or
> self-end, which are defined as follow in the last draft:
>
> "Aligns the alignment subject to be flush with the edge of the alignment
> container corresponding to the alignment subject’s start/end side."
>
> Even though I think my question applies to any other layout model, I'll
> focus on grid now. So for the {align, justify}-self properties, the
> alignment container would be the grid cell while the grid item would be
> the alignment subject.
>
> I assume that when the specification states that justify-self "justifies
> the box within its parent along the inline/row/main axis" it s referred
> to the alignment container's inline/row/main axis"; the same would apply
> to the align-self property, hence the container's block/column/cross
> axis would be the one the alignment subject is aligned along. Is my
> assumption right ?
>
> So, let's consider an orthogonal flow scenario with an horizontal-tb
> grid container and vertical-rl grid items. In the case of justify-self,
> for instance, since it aligns the grid items along the inline axis it's
> clear that when both alignment container's and subject's inline axis are
> parallel the start/end side correspond to the inline-start and
> inline-end grid item's side respectively. But, how I should understand
> it in the orthogonal flows scenario mentioned before ?
>
> What about an scenario with a vertical-lr grid container and
> horizontal-tb grid items ?

I don't understand what's confusing.  The self-start/end keywords
don't specify an axis; that's inferred from the property in which
they're used.  You just take the relevant side from either the
container's directionality/writing-mode or the element's, depending on
whether it's self-* or not, along the axis specified by the property.

Can you give a specific code example that you think isn't fully
specified by the spec?

~TJ
Received on Friday, 9 January 2015 21:16:50 UTC

This archive was generated by hypermail 2.4.0 : Friday, 17 January 2020 22:51:56 UTC