mirror of
https://github.com/servo/servo.git
synced 2025-08-13 09:25:32 +01:00
Fix min/max-content block size of replaced element (#34284)
The min-content and max-content sizes on the block axis depend on the inline size. But when computing the SizeConstraint corresponding to the inline axis, we were resolving the preferred inline size ignoring intrinsic keywords. Now we will only ignore `auto`. Also, this patch refactors the logic to compute the min-content and max-content block sizes after fully resolving the inline size. This avoids having to resolve the inline sizing properties twice. Signed-off-by: Oriol Brufau <obrufau@igalia.com>
This commit is contained in:
parent
696c591d81
commit
8c689aac67
3 changed files with 67 additions and 28 deletions
7
tests/wpt/meta/MANIFEST.json
vendored
7
tests/wpt/meta/MANIFEST.json
vendored
|
@ -572214,6 +572214,13 @@
|
|||
{}
|
||||
]
|
||||
],
|
||||
"replaced-element-044.tentative.html": [
|
||||
"58a4b9b76ff32010a82c49d1e5d42090d794a081",
|
||||
[
|
||||
null,
|
||||
{}
|
||||
]
|
||||
],
|
||||
"sign-function-aspect-ratio.html": [
|
||||
"e5ba1a8321a42918cccee4ee164527fa25078e4f",
|
||||
[
|
||||
|
|
33
tests/wpt/tests/css/css-sizing/aspect-ratio/replaced-element-044.tentative.html
vendored
Normal file
33
tests/wpt/tests/css/css-sizing/aspect-ratio/replaced-element-044.tentative.html
vendored
Normal file
|
@ -0,0 +1,33 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS aspect-ratio: replaced element transferring intrinsic sizes</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-sizing-4/#aspect-ratio">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-sizing-4/#aspect-ratio-size-transfers">
|
||||
<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/11236">
|
||||
<link rel="author" title="Oriol Brufau" href="mailto:obrufau@igalia.com">
|
||||
<meta name="assert" content="
|
||||
The inline size resulting from an intrinsic keyword is transferred
|
||||
to the block axis through aspect ratio.
|
||||
Except if the inline size is `auto`, then we ignore the ratio and
|
||||
just use the natural block size instead.
|
||||
">
|
||||
|
||||
<style>
|
||||
canvas { aspect-ratio: 1; height: auto; background: cyan; }
|
||||
</style>
|
||||
|
||||
<canvas width="50" height="25" style="width: auto"
|
||||
data-expected-width="50" data-expected-height="25"></canvas>
|
||||
<canvas width="50" height="25" style="width: min-content"
|
||||
data-expected-width="50" data-expected-height="50"></canvas>
|
||||
<canvas width="50" height="25" style="width: fit-content"
|
||||
data-expected-width="50" data-expected-height="50"></canvas>
|
||||
<canvas width="50" height="25" style="width: max-content"
|
||||
data-expected-width="50" data-expected-height="50"></canvas>
|
||||
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/resources/check-layout-th.js"></script>
|
||||
<script>
|
||||
checkLayout("canvas");
|
||||
</script>
|
Loading…
Add table
Add a link
Reference in a new issue