[css-flexbox-1] Flex container intrinsic sizing should disregard flex items with 'visibility:collapse'
css-flexbox-1
css-flexbox-1 says that collapsed items are treated (during a special second round of flex layout) "as having zero main size"
https://drafts.csswg.org/css-flexbox/#visibility-collapse
...and it notes that "dynamically collapsing or uncollapsing items may change the flex container’s main size"
https://drafts.csswg.org/css-flexbox/#visibility-collapse
Probably that means the flex container's intrinsic sizing should *not* take these items into consideration, right? (i.e. they should not directly contribute to the flex container's intrinsic main size)
However, the spec section on Intrinsic Sizes...
https://drafts.csswg.org/css-flexbox/#intrinsic-sizes
...doesn't appear to have any special handling for collapsed flex items ("struts"). Maybe it should?
Testcase:
```html
<!DOCTYPE html>
<div style="display:inline-flex; border: 2px solid black">
<div style="width: 50px; background: tan">X</div>
<div style="height: 50px; width: 90px; visibility: collapse; background: red">Y</div>
<div style="width: 50px; background: cyan">Z</div>
</div>
```
https://www.software.hixie.ch/utilities/js/live-dom-viewer/saved/14767
Right now, all browsers currently take the collapsed item into account for intrinsic sizing purposes (i.e. the black-bordered flex container ends up with a 190px-wide content box). I suspect the content box should in fact only be 100px wide, though (just wide enough to fit "X" and "Z").
Note that Chrome/Safari don't implement flexbox's special `visibility:collapse` "strut" behavior for collapsed flex items yet (see https://issues.chromium.org/issues/41085247 for Chrome; I assume there's a bug filed on WebKit's side too); so their rendering of this testcase shouldn't be taken as too authoritative here; it's just from not implementing this feature.
Firefox **does** implement visibility:collapse flex item "struts", but the fact that these struts influence the intrinsic main size of the flex container (in Firefox, and in the intrinsic sizing section of the flexbox spec) seems maybe-wrong.
关闭于 2026-06-11 2 条评论