The dialog element is now on the backlog with a priority of medium. You can track status changes at https://dev.modern.ie/platform/status/dialogelementformodals/
Annoying as it is, this is still the standard behavior of CSS: https://www.xanthir.com/blog/b4JF0
Recently, the -webkit-prefixed pseudo-elements were explicitly made the exception of this rule: https://github.com/w3c/csswg-drafts/issues/3051. There was a proposal to invert the rule, making all unknown pseudo-elements (and probably even pseudo-classes) potentially valid, except those explicitly listed as invalid, but it didn't seem to get much attention.
Yes, browsers still have some a11y issues with 'display: contents' (and there are still even some open issues in that area, e.g. how such elements should get focus: https://github.com/w3c/csswg-drafts/issues/2632). But no web feature, especially in CSS, has been implemented without any bugs and cross-browser inconsistencies. At least, browsers render the 'display:contents' elements the same way. and they would eventually fix the a11y issues as well. On the other hand, web devs demand this feature, and without it they would resort to hacks like container.outerHTML = container.innerHTML, which are way worse in many aspects, including a11y.
The CSS Display Level 3 spec where ‘display: contents’ was introduced is now Candidate Recommendation. So the spec is as stable as it’s possible in W3C, and all the competitors already support ‘display: contents’ consistently per the latest definition. And it seems to be the most demanded CSS feature on UserVoice at the moment!
The Edge Platform status page (https://developer.microsoft.com/en-us/microsoft-edge/platform/status/displaycontents/) currently reports that the status of this request has changed to "Not currently planned", but the link and the votes count there are from the "Implement Web Share API" request (https://wpdev.uservoice.com/forums/257854-microsoft-edge-developer/suggestions/31563175-implement-web-share-api). On this page, the status didn't change. What is the correct status of this feature now?
I hope that status change is just a technical error, since this request has currently the highest votes count among the open CSS-related request, is highly demanded by the web authors, and shipped by all other browser vendors!
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 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!
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/
The :has() pseudo-class is now on the Microsoft Edge backlog. You can track status updates at https://dev.modern.ie/platform/status/cssrelationalpseudoclasshas