W3C home > Mailing lists > Public > www-style@w3.org > May 2012

RE: [css3-flexbox][css3-align] start/end vs. before/after

From: Chris Jones <cjon@microsoft.com>
Date: Sat, 19 May 2012 20:44:47 +0000
To: fantasai <fantasai.lists@inkedblade.net>, Sylvain Galineau <sylvaing@microsoft.com>
CC: Glenn Adams <glenn@skynav.com>, Tab Atkins Jr. <jackalmage@gmail.com>, "www-style@w3.org" <www-style@w3.org>, Phil Cupp <pcupp@microsoft.com>, Markus Mielke <mmielke@microsoft.com>
Message-ID: <314AEA692CE6754A854276304D0CD6C01BA1FED7@TK5EX14MBXC261.redmond.corp.microsoft.com>
I think this is where the root of the issue lies - from my perspective, it doesn't make sense to say that the Grid has a main or secondary axis. AFAIK, there's nothing in the spec that specifies one or the other as being primary vs. secondary, and there's nothing in the functionality of the grid that suggests one is any different than the other. 

If someone can point to something that illustrates how Grid column alignment is functionally different from row alignment, that might be the basis for an argument that they should have different terminology. Absent that, however, I think Fran├žois' argument about minimizing the syntax a developer or author has to remember is what we should follow.

I think this line of reasoning also extends to Flexbox as well. Consider that the value "baseline" is generally paired with "before" and "after" - this makes a great deal of sense when we're talking about aligning content within a parent box. And, when a Flexbox is laid out horizontally, aligning items is similar to aligning content - the primary horizontal axis uses flex-pack,  start/end/etc., and the secondary vertical axis uses flex-align, before/after/baseline/etc. In Western LTR languages, this makes perfect sense because we have a horizontal typographic baseline, and might presumably want to talk about aligning Flexbox items to that baseline.

However, when the Flexbox is aligned vertically, all of this falls apart. All of the sudden, flex-pack controls the vertical alignment of an item, but it's still using start/end, and doesn't have an option for baseline alignment. Flex-align now controls the horizontal alignment of an item, including an option for baseline alignment, but I'm not sure how much sense this makes in an LTR language, since there really isn't the concept of a vertical baseline. In fact, the Flexbox spec states that "baseline" defaults to "start" when the main Flexbox axis is the same as the cross-axis, which further drives home the idea that item alignment is not really the same as content alignment, and therefore should not be subject to the same terminology.

-Chris


-----Original Message-----
From: fantasai [mailto:fantasai.lists@inkedblade.net] 
Sent: Saturday, May 19, 2012 12:33 PM
To: Sylvain Galineau
Cc: Glenn Adams; Tab Atkins Jr.; Chris Jones; www-style@w3.org; Phil Cupp; Markus Mielke
Subject: Re: [css3-flexbox][css3-align] start/end vs. before/after

My concern is that in 2D contexts (e.g. GCPM 'float' keywords, or 'caption-side'
values or logical margins), authors will have to use the start/end pair in the main axis and the before/after pair in the secondary axis. For alignment only to use start/end in both axes will be inconsistent, and therefore confusing.

~fantasai

Received on Saturday, 19 May 2012 20:45:35 GMT

This archive was generated by hypermail 2.3.1 : Tuesday, 26 March 2013 17:20:54 GMT