RE: box-align

I am not sure we've closed on this, have we?

The matter of expressing <center> in CSS I find quite interesting -- all browsers do implement it, so if defined properly there should be no new layout work just parse and apply...

FWIF, I believe we implement <center>, <left> and <right> by having an extra set of margins in widths & martins formulas, the extra margins can only be set to zero or auto and are considered last.

This thread however was not sponsored by the element <center>. I don't believe it is missed all that much. What people *really* want is vertical centering of direct children of a box with specified height (such as label in a button or video in viewport). That will work fine without inheritance.

Now, if somebody wants "true center" this is the thread to speak up)))

> -----Original Message-----
> From: Brad Kemper [mailto:brad.kemper@gmail.com]
> Sent: Saturday, April 30, 2011 11:37 AM
> To: L. David Baron
> Cc: Tab Atkins Jr.; Andrew Fedoniouk; Alex Mogilevsky; www-style list
> Subject: Re: box-align
> 
> 
> On Apr 30, 2011, at 10:56 AM, L. David Baron wrote:
> 
> > On Saturday 2011-04-30 10:17 -0700, Brad Kemper wrote:
> >> I recall arguing for putting it on the parent instead of the children
> >> in that conversation too. It is much more intuitive to set the
> >> alignment on the parent than to find all the children and have them
> >> work it out individually what alignment they should each be. Consider
> >> 'text-align', which is orders of magnitude more intuitive than
> >> 'margin-left:auto; margin-right:auto;'. With 'text-align' on a single
> >> line, the children are the glyphs and spans and such inside the line
> >> box parent. But we only ask the parent to align its children once; we
> >> don't ask each glyph and span what it's alignment should be relative
> >> to its parent.
> >>
> >> Aligning different child blocks differently is much more confusing
> >> (to people, not necessarily to "the model") and harder for authoring.
> >> I don't think this actually removes anything, anyway.
> >> You can still use 'margin-left:auto; margin-right:auto;' or flexible
> >> margin using flex-box.
> >
> > Yeah, I think you're right -- specifying how the children are aligned
> > is better.
> >
> > But there's also the question of whether the property inherits -- for
> > the use case of adding a property that describes the
> > backwards-compatible <center> behavior, the property would affect
> > children and it would inherit -- but I'm not sure if inheritance is
> > wanted here.
> 
> I don't see a problem with letting the block alignment inherit, and I do
> like the idea of being able to describe traditional <center> and <DIV
> @align> behavior.
> 
> > If this doesn't inherit, browsers will still need some concept that
> > does inherit to implement <center> and <div align=...>.
> > (But if that continues to be the kludge of extra values on text-align,
> > it's not clear to me how that would interact with
> > box-align.)
> 
> I pretty sure I don't understand. How is text-align affected?
> 
> I imagined something like this:
> 
> center {
> 	block-align-x: center;
> 	text-align: center;
> }
> div.vert_center {
> 	block-align-y: middle;
> 	vertical-align:middle /* for inline vertical centering */; }
> 
> div.all_center {
> 	block-align: center /* same as block-align: center middle */;
> 	text-align: center;
> 	vertical-align:middle /* for inline vertical centering */; }
> 
> With:
> 
> block-align: [left|center|right]? [top|middle|bottom]?
> with at least one value required. Initial value is 'block-align:left top'.
> 
> A good question (to me, anyway) should be how this fits with bidi. Should
> vertical always be vertical, or should block-align-y actually be
> translated as something like 'block-align-block-progression-direction'? I
> lean towards the later, so that there is symmetry with the inline
> alignments (text-align and the inline version of vertical-align). If so,
> then we also need start, end, etc.
> 
> 

Received on Thursday, 12 May 2011 17:26:42 UTC