Re: Template-Based Positioning

On Tue, Mar 17, 2009 at 6:15 PM, David Hyatt <hyatt@apple.com> wrote:
> Regarding template-based positioning...
>
> http://www.w3.org/TR/css3-layout/#template-based
>
> Right now the spec works by overloading the display property with the layout
> and the position property with letters.  It seems like tacking "-webkit-" in
> front of these display/position values would be really strange.  I have the
> following suggestions to make regarding the syntax to make it easier to
> provide an experimental implementation (and to provide some clarity as
> well):
>
> (1) Just make the display property take a new value: grid-template.
>        display: grid-template
>
> (2) Add a new grid-template property that takes the layout string.

I'm happy with these two.  It'll make it easier to programmatically
switch between display:template and display:none as well - less
information I have to shove into an attribute or storage for later.

Alternately, implement the split in display that was proposed in the
module, where the template is given in display-model and display-role
is just "block".  This just means that authors will have to be
explicit in declaring a template with -webkit-display-model while it's
experimental, rather then being able to take the shortcut of giving
the template straight to the display property.

> (3) Modify the position property to be more clear that content is going into
> a slot.  Something along the lines of
>        position: slot(a)
>
>        instead of just
>
>        position: a

I'm in favor of this, but I'm still ambivalent about using the display
property for it.  *Especially* with template layout, it's a valid
concern that authors will want to slide content into a slot, and then
further position it.

I emphasize "especially in Template Layout" because it doesn't use the
position property like normal.  If you put two elements in slot(a),
they don't overlap.  Slot(a) is just a container that then holds both
elements, positioned according to the normal static flow.  One could
then very reasonably want to abspos one of the elements wrt the slot,
or relpos either of them to get them to 'overflow' their slot
boundaries (this can also be done with margins, of course, but it's a
different effect).

In an earlier discussion[1], Giovanni and I explored the idea of
reifying flows, so that a flow is a legitimate object within CSS that
can be used by rules.  Since then I've felt that using a flow
mechanism for Template Layout is the most natural and effective
method.  It will also be more and more helpful as we introduce *more*
ways to move multiple elements into entirely new containers, such as
footnotes in GCPM, or the tabbed layout outlined in the Template
Layout module.

The ::slot() pseudoelement would automatically have its content:
property set to receive the appropriately named flow, so you'd just do
a move-to: slot(a) (or position-flow: slot(a), or float: to(a), or
whatever).


[1]: http://lists.w3.org/Archives/Public/www-style/2009Feb/0324.html

~TJ

Received on Wednesday, 18 March 2009 13:08:47 UTC