| Summary: | [css-grid] Resolution of percentage padding/margin is inconsistent for orthogonal writing-mode | ||||||
|---|---|---|---|---|---|---|---|
| Product: | WebKit | Reporter: | Javier Fernandez <jfernandez> | ||||
| Component: | Layout and Rendering | Assignee: | Nobody <webkit-unassigned> | ||||
| Status: | NEW --- | ||||||
| Severity: | Normal | CC: | bfulgham, jfernandez, rego, simon.fraser, zalan | ||||
| Priority: | P2 | ||||||
| Version: | WebKit Nightly Build | ||||||
| Hardware: | Unspecified | ||||||
| OS: | Unspecified | ||||||
| See Also: | https://bugs.chromium.org/p/chromium/issues/detail?id=808758 | ||||||
| Attachments: |
|
||||||
This bug is the cause of the following WPT failures on several cases: grid-items/grid-items-percentage-paddings-vertical-rl-002.html grid-items/grid-items-percentage-paddings-vertical-lr-002.hmtl grid-items/grid-items-percentage-paddings-002.html |
Created attachment 355635 [details] Test case to reproduce the issue Check the attached example. There's a wrapper element with a fixed height of 100px. Inside it there's an element with a fixed width of 500px. That element has a vertical element inside (orthogonal) with some content and a margin-top of 10%. The margin-top should be resolved against the width of the parent, so 10% of 500px is 50px. The margin-top is computed correctly. However, the problem comes when computing the available height of the orthogonal element. We should use the 100px from the wrapper ans subtract the margin-top, so the height of the orthogonal element should be 50px. But we're subtracting only 10px (10% of 100px), and setting a 90px height which is wrong.