[css-display] "flow-root" for property "display" is harmful (original) (raw)

"display: flow-root" is harmful:

  1. requires to use an extra Element
  2. spec doesn't support display multiple values like display: flex flow-root

Please implement a new/different property for "flow-root"! Seems any existing property without multiple values support will be harmful ...

How you would want to apply flow-root for flex Element .selector?

.selector {
    display: flex;
}
<div class=selector></div>

It requires:

.clearfix {
    display: flow-root;
}
.selector {
    display: flex;
}
<div class=clearfix>
    <div class=selector></div>
</div>

If nothing changed, the the old approach is perhaps better:

.selector {
    display: flex;
}
.selector:after {
    content: “”;
    display: block;
    clear: both;
}
<div class=selector></div>

Imagine if flow-root needed for 2 thousands of Elements - will you require to add in DOM extra 2 thousands Elements only for "clearfix"? ...