| Summary: | Flex container width and height incorrectly calculated for `flex-flow: column wrap` | ||||||
|---|---|---|---|---|---|---|---|
| Product: | WebKit | Reporter: | Greg Whitworth <gwhit> | ||||
| Component: | CSS | Assignee: | Nobody <webkit-unassigned> | ||||
| Status: | NEW --- | ||||||
| Severity: | Normal | CC: | ahmad.saleem792, jonlee, marsjaninzmarsa, m.goleb+bugzilla, philip, webkit-bug-importer | ||||
| Priority: | P2 | Keywords: | InRadar | ||||
| Version: | WebKit Nightly Build | ||||||
| Hardware: | Unspecified | ||||||
| OS: | Unspecified | ||||||
| Attachments: |
|
||||||
Created attachment 418984 [details] Screenshot from STP 119. I'm trying to figure out what the current status of implementation is here, and testing http://codepen.io/anon/pen/pJLwYp in Chrome, Firefox and Safari I get almost identical renderings, attaching the screenshot from STP 119. Are there tests in WPT about this behavior? I've found that https://bugs.chromium.org/p/chromium/issues/detail?id=507397 is the corresponding Chromium bug for this, linking to the same test case. There may be useful discussion/links there. Safari Technology Preview 179 matches Firefox Nightly 120 while differs from Chrome Canary 119 (fixed recently in Chrome 117). |
Other browsers tested: Add OK or FAIL after other browsers where you have tested this issue: Safari: FAIL Firefox: FAIL IE 7/8/9/10: FAIL Chrome: FAIL Edge: OK What steps will reproduce the problem? 1. Go to http://codepen.io/anon/pen/pJLwYp 2. Notice how the containing <ul> does not actually contain it's <li> children. It's size is being incorrectly calculated. What is the expected result? The <il> children should be contained no matter how they wrap and no matter how many children are present. If you look at the demo in Edge, it renders correctly. What happens instead? The containing <ul> does not fully contain its children.