Repository navigation
[css-display] BFC roots may not be block boxes #1471
Description
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".
Activity
SelenIT commentedon May 29, 2017
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 commentedon Jul 5, 2017
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:
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 commentedon Jul 5, 2017
I disagree with some things:
"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.
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.
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 commentedon Jul 5, 2017
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 commentedon Jul 6, 2017
@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.
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".
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-rootas the BFC value.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
No, they establish formatting contexts. Only flow-layout stuff establishes block formatting contexts.
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 commentedon Jul 6, 2017
@tabatkins
I prefer "BFC root", but I guess it's OK when being informal.
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: ..."
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 commentedon Jul 6, 2017
@tabatkins
Could you please clarify this a bit?
First, the CSS2.x spec currently specifically says that
Second, both Flexbox and Grid specs say that
Doesn't it mean that, if the item has
display:blockas a computed value, then it establishes the BFC?[css-display] 各種更新
Loirooriol commentedon Jul 6, 2017
@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 hasdisplay: blockthen it's "flow-layout stuff" and establishes a BFC.[css-display] Define block formatting context root, plus a few other …
Loirooriol commentedon Jul 14, 2017
After ffc79e4 it's much more clear, thanks.