[css-flexbox] Treat input elements with percent sizes as having "compressible" min-content sizes
Categories
(Core :: Layout: Flexbox, defect)
Tracking
()
Tracking | Status | |
---|---|---|
firefox86 | --- | fixed |
People
(Reporter: dholbert, Assigned: TYLin)
References
(Blocks 2 open bugs, )
Details
Attachments
(4 files, 1 obsolete file)
In this github issue, the CSSWG defined some elements as having a "compressible" min-content width:
https://github.com/w3c/csswg-drafts/issues/1889
https://github.com/w3c/csswg-drafts/commit/6a3be51bdda0ccb92af0d09556d6d1f2e7d8874d
Direct spec link: "Compressible Replaced Elements" https://drafts.csswg.org/css-sizing/#min-content-zero
We need to implement that change.
(This was originally a Chrome bug, up until that spec change which standardized on the Chrome behavior, kind of. I filed https://bugs.chromium.org/p/chromium/issues/detail?id=581545 a while back and initially misunderstood the spec change to be different from what Chrome does, but now I'm pretty sure the spec calls for basically what Chrome does.)
Reduced-ish testcase: https://jsfiddle.net/pfv2x6sd/1/
EXPECTED RESULTS: The textfield element shouldn't overflow the red-bordered area.
ACTUAL RESULTS: The textfield does overflow.
Reporter | ||
Updated•5 years ago
|
Reporter | ||
Updated•5 years ago
|
Reporter | ||
Updated•5 years ago
|
Reporter | ||
Updated•5 years ago
|
Updated•5 years ago
|
Updated•5 years ago
|
Updated•4 years ago
|
Updated•4 years ago
|
Updated•4 years ago
|
Updated•4 years ago
|
Comment 2•4 years ago
|
||
Submitted spec issue https://github.com/w3c/csswg-drafts/issues/5665
Updated•4 years ago
|
Assignee | ||
Comment 5•4 years ago
|
||
The testcase in comment 4 missed the <input>
style. This is the correct one.
Assignee | ||
Updated•4 years ago
|
Assignee | ||
Comment 7•4 years ago
|
||
It is not worth having typedefs that are unused or used only once.
Assignee | ||
Comment 8•4 years ago
|
||
We want to call it in nsFlexContainerFrame in the next part.
The method also tests form control elements, not just replaced boxes, so
rename it for accuracy.
Depends on D99950
Assignee | ||
Comment 9•4 years ago
|
||
Add a testcase for <input> and <input type="range">, which are two
common elements causing webcompat issues for Firefox.
Note: Google Chrome 89 and Safari 14 fails the test with width: calc(120px + 100%)
.
Depends on D99951
Assignee | ||
Comment 10•4 years ago
|
||
It seems Mats had tried to fix this bug in bug 1513959. I didn't follow closely in the bug, but I guess bug 1316534 fixed some cases but made other cases more prominent.
Updated•4 years ago
|
Updated•4 years ago
|
Comment 11•4 years ago
|
||
Comment 13•4 years ago
|
||
bugherder |
https://hg.mozilla.org/mozilla-central/rev/de0d8a9f9b9b
https://hg.mozilla.org/mozilla-central/rev/ebc9f0bf246f
https://hg.mozilla.org/mozilla-central/rev/a605cd525450
Description
•