[css-display-3] The definition of BFC does not include flex item

[Mookiepiece]

quoting something from #1471

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

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.

if a flex container could establish a "BFC", why flex item cannot?

I suggest to correct the BFC definition

from

• (very loosely) any block-level box that establishes a new formatting context (other than an inline formatting context)

to

• (very loosely) any box that establishes a new formatting context (other than an inline formatting context)

(someone has added “flex item” without “flex container” to the BFC page on MDN for a long time. I am not sure how to correct that page, that's one reason I come here)

[SelenIT]

The glossary in the spec seems to differentiate the strict definition of the block formatting context and the informal, colloquial term "BFC" that is often used in a broad sense "anything that always contains nested floats and margins of descendants, unlike usual display: block flow boxes".

In the strict sense, a flex container can't be said of that it "establishes the block formatting context", since it establishes the flexbox formatting context instead. In the broad sense, one could say that the flex container doesn't let nested floats out because "it is a BFC" (as a shorter way to express that these floats are actually contained by the block formatting context established by flex items). That said, I agree that this abbreviation is not often used in this sense (as mentioned in the related issue) and adding this "very loose" meaning to the list might be confusing.

Regarding flex items (and grid items as well), I believe they fall under the first meaning, "a block container that establishes a new block formatting context for its contents". So I believe that current MDN page is correct saying that flex items establish the block formatting context (in a strict sense) while flex containers don't. However, I edited that page to clarify that flex/grid items establish the block formatting context only if they are block containers themselves, not flex or grid or table containers.

[Loirooriol]

We are talking about the "very loosely" definition. A flex item is blockified and gets a block outer display type, so "very loosely" can be considered a block-level box, I guess.

[Mookiepiece]

@SelenIT
I think that's fine at first, but we are making things complex. You can see that page once more, we need change that list into "floats without display:flex" "position:absolute without display:flex" "overflow:hidden without display:flex"

FFC is BFC with flex layout, they are not the same, I know, and I don't think other CSS leaners are willing to know that.

@Loirooriol
I reminded that an inline-block also establishes a new BFC, display:inline-flex is inline too. they are not block-level box, they don't match the "very loosely" one.

SelenIT: Regarding flex items (and grid items as well), I believe they fall under the first meaning

I think I don't have misunderstood the words "one of" and "very loosely" in spec. I mean, I thought the very loosely one will include all the cases.

[Loirooriol]

I thought the very loosely one will include all the cases

That's not what I understood. My understanding was effectively that the very loose definition was excluding inline-block and inline-flex. Which can make sense: the B in BFC is "block", and if it can refer to other formatting contexts than block ones, then it seems to me that it means block-level (or strictly speaking, non-inline-level) formatting context.

But I don't know, not a fan of this loose definition, I would remove it and just leave the proper one.

BTW, it seems that, instead of BFC, the concept that you want is "independent formatting context".

[Mookiepiece]

ok fine, thanks for your discussion