[css-display] BFC roots may not be block boxes

[Loirooriol]

The definition of BFC in the glossary says

Often used to refer to a block formatting context root, that is, a block box that establishes a new block formatting context for its contents.

Correct me if I'm wrong, but I think a BFC root is just a box that establishes a BFC. It's not necessary block-level, so it may not be a block box. For example an inline-block is an inline-level BFC root.

Instead of "block box" I would say "block container" or just "box".

[SelenIT]

That quote is about informal use of the abbreviation, and it's usually in sutuations where you need to distinquish the two kind of block boxes — those that don't contain floats and margins of their descendants and those that do. It's rarely used for inline-blocks, tables etc., since they always contain these things. But I agree that this note can be understood as a definition of the block formatting context root, so it's worth to correct it as you suggested.

[fantasai]

Alright, the new prose now says

BFC
Abbreviation for block formatting context. Has various informal definitions referring to boxes which contain internal floats, exclude external floats, and suppress margin collapsing, and may refer specifically to:

• a block containerthat establishes a new block formatting context for its contents
• a block box (i.e. a block-level block container) that establishes a block formatting context for its contents (as distinguished from a block box which does not)
• any block-level box that establishes a new formatting context (other than an inline formatting context)

Let me know if there needs to be any further edits. Note that this term does not appear in specs, only in discussions about CSS outside of specs.

[Loirooriol]

I disagree with some things:

1. Has various informal definitions referring to boxes

   "BFC" refers to the formatting context established by these boxes, not to the boxes themselves. Maybe you are defining a "BFC root" instead? I wouldn't remove that term.

2. a block box (i.e. a block-level block container)

   If in point 1 you already included all block containers that establish a BFC, why are you repeating block boxes in point 2? I would remove this, just like there is no need to repeat inline-blocks.

3. any block-level box that establishes a new formatting context

   Huh? I don't see the relationship between a BFC and e.g. a block-level flex container. It establishes a FFC, not a BFC.

[SelenIT]

Regarding the last point, flex/grid items and table cells/captions do establish the BFC for their content, so table wrappers and flex/grid containers effectively fit the definition of block-level boxes that "contain internal floats, exclude external floats and suppress margin collapsing" (though are not BFC roots themselves). Maybe it should be mentioned as a separate note after the BFC definition (not as its part)?

Also, although the terms "BFC" or "BFC root" aren't used in the spec, definitions like "an element in the normal flow that establishes a new block formatting context" are used in CSS2.x. Wouldn't it make sense to make the term normative and use it there instead, for brevity and readability?

[tabatkins]

@Loirooriol It's important to note the purpose of this definition - it's not to provide spec prose, it's to give a helpful search-friendly term that hopefully people will land on when they see the term "BFC" thrown around on Stack Overflow or something. Thus why it's referring to "informal" definitions.

"BFC" refers to the formatting context established by these boxes, not to the boxes themselves.

Informally, it often refers to the box itself as well. We use that a lot when discussing the spec, and people throw it around when discussing hacks - things like "you need to make the div a BFC so it'll contain the floats".

If in point 1 you already included all block containers that establish a BFC, why are you repeating block boxes in point 2?

Because they're different and don't repeat themselves. "Block container" includes inline-blocks, which we do indeed sometimes include when talking about BFCs. But sometimes it's used to refer solely to block-level ones; for example, when we discuss the four flow values, we often refer to block flow-root as the BFC value.

Huh? I don't see the relationship between a BFC and e.g. a block-level flex container. It establishes a FFC, not a BFC.

Again, we're talking about informal definitions. If you're, for example, trying to understand how a flex container with a preceding sibling float behaves, it's not uncommon to call the flex container a "BFC" informally, because this term is already heavily used when describing the "overflow:hidden" hack for blocks, and similar tricks to trigger the creation of a block formatting context.

@SelenIT

Regarding the last point, flex/grid items and table cells/captions do establish the BFC for their content,

No, they establish formatting contexts. Only flow-layout stuff establishes block formatting contexts.

Wouldn't it make sense to make the term normative and use it there instead, for brevity and readability?

Not particularly. The term isn't used all that often anyway, and we're often referring to the more generic notion of formatting contexts. Normatively using an acronym would just make it more jargon-y.

[Loirooriol]

@tabatkins

Informally, it often refers to the box itself as well.

I prefer "BFC root", but I guess it's OK when being informal.

Because they're different and don't repeat themselves.

OK, I didn't get the points represent different possible definitions. I thought it was a single definition. Maybe say "and may refer specifically to one of: ..."

it's not uncommon to call the flex container a "BFC"

I have never seen this, and I think including it in the spec will cause much more confusion than what you are attempting to address by being informal. I do think there should be some term to refer to formatting contexts other than inline and ruby, maybe "strong FC", "real FC" or similar.

[SelenIT]

@tabatkins

Only flow-layout stuff establishes block formatting contexts.

Could you please clarify this a bit?
First, the CSS2.x spec currently specifically says that

... block containers (such as inline-blocks, table-cells, and table-captions) that are not block boxes ... establish new block formatting contexts for their contents.

Second, both Flexbox and Grid specs say that

A [flex/grid] item establishes a new formatting context for its contents. The type of this formatting context is determined by its display value, as usual.

Doesn't it mean that, if the item has display:block as a computed value, then it establishes the BFC?

[Loirooriol]

@SelenIT I think Tab meant that a flex item does not necessarily establish a BFC, e.g. if it has display: flex, it establishes a FFC instead. But if it has display: block then it's "flow-layout stuff" and establishes a BFC.

[Loirooriol]

After ffc79e4 it's much more clear, thanks.