The name of this issue might be slightly confusing because in Russian web dev community the word "clearfix" is often used as an umbrella term for all kinds of "containing floats" problem solutions, not only for the (in)famous clearing pseudo-element hack. It's true that nowadays we have layout mechanisms much better than floats (which never were meant to be used as layout mechanisms and were used as such only because of lack of alternatives).
However, floats are still great for things they were intended for (like text and graphical insets flowed around by the main text, neither Flexbox nor Grid can reasonably do this), and having a standard way for containing them, as well as for containing child elements' margins, is still very useful, especially in the component world where different parts of the layout shouldn't affect each other (the CSS Containment spec explicitly requires `display:flow-root` for Layout containment).
I believe that implementing this shouldn't be hard, given that it's basically the same behavior as the well-supported `column-count:1` does (and that IE had the similar behavior ages ago — the legendary hasLayout:)...
...but, yes, do display:contents first, please!
Chrome, which has already implemented display:contents behind the flag, is about to ship it: https://groups.google.com/a/chromium.org/forum/#!msg/blink-dev/XzdNrEvn4Qk/650SpqXTBAAJ
The CSS Display Level 3 spec is ready to transition to CR state (https://www.w3.org/blog/CSS/2017/07/20/display-align-update/), the `display:contents` value is well-defined and stable enough, and there is a good test suite for it.
Please implement this feature, we, web developers, really need it!
WebKit has just enabled display:content by default: https://trac.webkit.org/changeset/224822/webkit
This makes it the 2nd shipped implementation (after Gecko's). Chrome's implementation (behind the flag) is also rather good (it even handles the "unusual" element more-or-less correctly according to the latest spec edition) and probably will be shipped very soon.
So is Microsoft again the only major browser vendor without any implementation of this extremely useful feature? How is it possible?
display:contents has been supported unprefixed in Firefox and is currently in development in Chrome (https://bugs.chromium.org/p/chromium/issues/detail?id=657748). It is also very useful in implementing slots feature from Shadow DOM v.1 spec. And it's very useful for placing elements from different containers into the common grid using CSS Grid Layout (it's already possible in Firefox Nightly/Alpha and likely will soon be possible in Chrome). Is implementing it so hard?
The initial and unset CSS wide values are already in development in Microsoft Edge. The all shorthand property is now on the backlog with a priority of medium. You can track status updates at https://dev.modern.ie/platform/status/cssallshorthand/
This work is now in Microsoft Edge Insiders Preview 17074 and higher.
The :has() pseudo-class is now on the Microsoft Edge backlog. You can track status updates at https://dev.modern.ie/platform/status/cssrelationalpseudoclasshas