Re: [css3-layout] A shortcut with numbers instead of letters in a template

On Fri, Dec 2, 2011 at 3:42 AM, Bert Bos <bert@w3.org> wrote:
> On re-reading the documentation of the template layout implementation in
> HTMLayout by Andrew Fedoniouk and Ivan Goroun
> (http://www.terrainformatica.com/w3/flex-layout/flex-layout.htm) I
> noticed something that I hadn't seen before; or maybe seen but
> forgotten:
>
> The template syntax allows numbers as a shortcut for simple (but
> probably common) cases. E.g. if you have a document like this
>
>    <BODY>
>      <DIV>North...</DIV>
>      <DIV>West...</DIV>
>      <DIV>East...</DIV>
>      <DIV>South...</DIV>
>
> you could write this layout:
>
>    BODY { display: ". 1 ."
>                    "2 . 3"
>                    ". 4 ." }
>
> instead of the equivalent:
>
>    BODY { display: ". a ."
>                    "b . c"
>                    ". d ." }
>    DIV:nth-child(1) { position: a }
>    DIV:nth-child(2) { position: b }
>    DIV:nth-child(3) { position: c }
>    DIV:nth-child(4) { position: d }
>
> I.e., the numbers refer directly to the children of the template
> element. The designated children are automatically positioned in the
> given slot, without having to write any rules for them.
>
> Advantages:
>
>  - No need to invent names for the slots in the template.
>  - Shorter: avoids extra rules and selectors with pseudo-classes.
>
> Disadvantages:
>
>  - An extra thing to learn.
>  - Spaces between slots in a templates are required (rather than
>    optional), because numbers can have more than one digit.
>
> Clearly, this shortcut is limited to positioning child elements (not
> other descendants), and to slots with at most one element in it. You
> still need named slots for the other cases.
>
>
> So the question is, do the advantages outweigh the disadvantages?

I don't like that this makes spaces required in templates.

Does this make multi-character slot names valid in general?  If so,
what happens when I name one of my slots "absolute"?

What happens if you use "1" in a template, but your first child has
"position: fixed;" or worse, "position: a;"?

~TJ

Received on Friday, 2 December 2011 16:43:20 UTC