News to me! There is a spec for it and Firefox says they intend to ship it. It’s just like display: block; only:
It always establishes a new block formatting context for its contents.
.group {
display: flow-root;
}
Meaning: you don’t have to use clearfix hacks. There is a bit more to it though. Fiona Chan has a mini-talk all about block formatting context. I think it affects z-index and transforms in some cases too. Anybody?
I suspect Nicole Sullivan will approve. She’s been writing and talking about new formatting contexts forever. In 2010 she even wrote:
I wish we had a simple property value pair that would do the same thing in standards-based browsers.
.lastUnit {
formatting-context: new; /* please! */
}
Just using overflow isn’t a real solution. It hides box-shadow, for one thing.
Also See
Rachel Andrew: The End of the Clearfix Hack?
Thierry Koblentz: display: flow-root versus clearfix
Direct Link ?