Re: [css-line-grid][css-books] (base)line grids

On Wed, Oct 1, 2014 at 12:48 PM, Håkon Wium Lie <howcome@opera.com> wrote:
> There are, however, two predefined baseline grids in CSS Books: 'root'
> and 'page'. 'root' is there so that all elements can refer to one
> common baseline grid, no matter what other ancestor elements have
> done. In this example, article and aside content would use the same
> baseline grid:
>
>   body { line-grid: create }
>   article { line-grid: root }  /* ignore what <body> did, engage the 'root' baseline grid instead */
>   aside { line-grid: root }    /* ignore what <body> did, engage the 'root' baseline grid instead */
>
> It seems like a good, if not super-important, use case -- it gives you
> some of the flexibility of named baseline grids without introducing
> arbitrary name spaces. How would you express this in CSS-line-grid?

I'm curious as to why you think it's sufficient to let elements refer
to the root line grid over their nearest line grid, as opposed to any
other line grid in their ancestor list.  'rem' over 'em' has a similar
question, but the answer to that is that the root element gets the
user's default font size, if you haven't manually changed it, and
that's a useful bit of data above just "the size of an ancestor".

> 'page' is there so that baselines can be defined wrt. the page box.
> Different pages may have different page margins, but you still want
> baselines on different pages to align to avoid see-through when
> printed. E.g.:
>
>    @page introduction { margin: 10% }
>    @page chapter { margin: 6% }
>    body { line-grid: page }
>
> This seems quite important for printed documents and I suggest it is
> added to CSS-line-grid (it's mentioned in a note in the most recent WD).

How do you establish the line-grid here?  Is it established by the
first page?  Or by the root element?

> I don't understand why the keywords are called 'block-start' and
> 'block-end' -- shouldn't they have "before" and "after" in them
> instead of "start" and "end"? I always mix these up myself -- 'before'
> and 'start' sounds much too much like synonyms in my head -- but I
> believe "before" refers to the top edge (assuming latin), and "start"
> refers to the left edge? If so, I don't understand how you would align
> the left edge of the block with a baseline grid?

A year or so ago we finally resolved on what to call the logical
directions - they're named "block-start/end" and "inline-start/end",
or just "start/end" when the axis is unambiguous or irrelevant.
Everyone else had the same problems you did, where they forgot which
of "before" and "start" were which axis.  (We temporarily tried out
"head" and "foot" for the block axis, as that invoked "header" and
"footer" and was clearer, but it turns out that japanese publishing
still puts the header and footer at the top/bottom of the page, so it
didn't help.)  The old names also had the problem of being difficult
to use in Flexbox and other contexts where the axis is variable; the
new names don't, as you just use the short "start/end" form then.

~TJ

Received on Wednesday, 1 October 2014 17:12:33 UTC