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

[css3-align] The Great Alignment Bikeshed

From: fantasai <fantasai.lists@inkedblade.net>
Date: Sun, 13 May 2012 16:21:30 -0700
Message-ID: <4FB041FA.9080309@inkedblade.net>
To: "www-style@w3.org" <www-style@w3.org>
So the CSSWG agreed last week to pursue a common alignment property model,
based on the "Box Alignment" proposal I posted to the list a few weeks ago.
This thread is on what names to use on each of the properties. Let's make
this quick, so we can use those names for Flexbox alignment!


Fundamentally, we're breaking down the properties along two axes:

   * in which dimension are things being shifted? There are two:
       X) inline (main)
       Y) stacking (cross)

   * what's being aligned within what?
       A) element itself within its containing block
       B) element's contents within itself
       C) element's child items within their container

The last concept's a bit tricky: it exists due to 'flex-align', which sets
the default cross-alignment (i.e. interpretation of 'flex-item-align: auto')
for the child flex items. This is different from B), which for Flexbox aligns
the entire stack of lines within the flex container (i.e. 'flex-line-pack').
For a grid container, it would set the default alignment of each grid item
within its slot--as opposed to the alignment of the grid within the grid
element (if the grid is smaller than the grid element). The idea is to
control, as a set, all the children whose alignment container is not the
element itself, but some intermediate structure.

On to the candidates! I have collected three sets, which you can mix and
match, below. (They are also listed in the draft.)

Set 1: Box/Content/Default

  A |     box-justify      box-align
  B | content-justify  content-align
  C | default-justify  default-align

Set 2: Self/Content/Item

  A |    self-justify     self-align
  B | content-justify  content-align
  C |    item-justify     item-align

Set 3: Outside/Inside/Items

  A | justify-outside  align-outside
  B | justify-inside   align-inside
  C | justify-items    align-items

What do you think works best? Why? Do you have another suggestion?

p.s. If you want nicer typesetting of this issue, there's this overview:
Further background is available in this email, which formed the basis
for the Box Alignment draft:

Received on Monday, 14 May 2012 03:56:19 UTC

This archive was generated by hypermail 2.3.1 : Monday, 2 May 2016 14:38:59 UTC