W3C home > Mailing lists > Public > www-style@w3.org > February 2011

RE: [css3-flexbox] anonymous flexbox children

From: Alex Mogilevsky <alexmog@microsoft.com>
Date: Wed, 23 Feb 2011 22:51:19 +0000
To: Tab Atkins Jr. <jackalmage@gmail.com>
CC: www-style list <www-style@w3.org>
Message-ID: <D51C9E849DDD0D4EA38C2E539856928411EA0A2D@TK5EX14MBXC212.redmond.corp.microsoft.com>
Current definition of "flexbox children" looks like this:

http://dev.w3.org/csswg/css3-flexbox/Overview.new.html#flexbox-children

# Block-level and atomic inline-level children of the flexbox are referred to as 
# flexbox children in this specification. Inline children are wrapped in anonymous
# blocks, and these anonymous blocks are also flexbox children.

http://dev.w3.org/csswg/css3-flexbox/Overview.new.html#display-flexbox

# All children of a flexbox must be block-level or atomic inline-level elements. 
# Contiguous runs of non-replaced inline elements are wrapped in an anonymous 
# block-level box. Out-of-flow elements (such as absolutely positioned elements -
# floats are also out-of-flow but can't exist as flexbox children) leave behind a 
# "placeholder" in their original source location which is treated like a non-replaced
# inline element for the purpose of this wrapping. (This can, for example, create 
# an empty flexbox child, if all the children are block-level elements and one is 
# absolutely positioned.) It is recommended that authors avoid putting in elements
# which are auto-wrapped with anonymous boxes, as the anonymous boxes
# cannot be targeted and controlled with the various flexbox properties defined 
# in later sections.

I'd like to make sure this includes clarifications that we previously agreed on, specifically

1) replaced inline-block children of flexbox are considered "flexbox-children" (http://www.w3.org/Style/CSS/Tracker/issues/145). I think the current text covers that, as it refers to "non-replaced inline elements"

2) block elements contained within inline elements are not "flexbox children" as they are not direct children of flexbox element. To make this clear I suggest adding this:

# Contiguous runs of non-replaced inline elements are wrapped in an anonymous 
# block-level box. 
<INS> 
* Any indirect descendants of flexbox element (including block elements that 
* are contained in inline elements) are not flexbox children.
</INS> 
# Out-of-flow elements (such as absolutely positioned elements -
# floats are also out-of-flow but can't exist as flexbox children) leave behind a 
# "placeholder"...

Does it make it more clear?

BTW I find it confusing that the entities that are involved in flexbox layout are called "flexbox children" and child elements of flexbox element are called the same. It makes coming up with these definitions difficult. Can we come up with a separate term for the boxes being arranged by flexbox? Like "flexbox items" (that would be consistent with "grid items" which we currently use in Grid Alignment spec). Or "flexbox child blocks", or "flexbox content boxes"?

Alex

-----Original Message-----
From: Tab Atkins Jr. [mailto:jackalmage@gmail.com] 
Sent: Monday, February 07, 2011 1:19 PM
To: Alex Mogilevsky
Cc: www-style list
Subject: Re: [css3-flexbox] anonymous flexbox children

On Mon, Feb 7, 2011 at 12:58 PM, Alex Mogilevsky <alexmog@microsoft.com> wrote:
> The analogy with table is good in the way that nesting a valid table cell in a inline element creates an anonymous cell around the inline, and the nested cell is no longer part of this table. It does match my expectations for anonymous flex boxes.
>
> Can we add specific language to the flexbox spec (I don't mind starting with my version;) so that implementors can agree or disagree?

Certainly.  I'll draft up something today.

~TJ

Received on Wednesday, 23 February 2011 22:51:53 GMT

This archive was generated by hypermail 2.3.1 : Tuesday, 26 March 2013 17:20:37 GMT