mirror of
https://github.com/servo/servo.git
synced 2025-08-06 14:10:11 +01:00
Fix stretch
sizes on replaced abspos (#34430)
We were sizing absolutely positioned replaced elements within their actual containing block instead of the inset-modified containing block. Then the `stretch` keyword would result in a wrong size. Signed-off-by: Oriol Brufau <obrufau@igalia.com>
This commit is contained in:
parent
54761b4f32
commit
5201c84fb4
5 changed files with 189 additions and 120 deletions
26
tests/wpt/meta/MANIFEST.json
vendored
26
tests/wpt/meta/MANIFEST.json
vendored
|
@ -242884,6 +242884,32 @@
|
|||
],
|
||||
{}
|
||||
]
|
||||
],
|
||||
"positioned-replaced-2.html": [
|
||||
"9a991d236ef2ddd7b8df1d4bff43578e5e741a68",
|
||||
[
|
||||
null,
|
||||
[
|
||||
[
|
||||
"/css/reference/ref-filled-green-100px-square-only.html",
|
||||
"=="
|
||||
]
|
||||
],
|
||||
{}
|
||||
]
|
||||
],
|
||||
"positioned-replaced-3.html": [
|
||||
"c11fcfd9521fc212929524e63f02a4ea218052c2",
|
||||
[
|
||||
null,
|
||||
[
|
||||
[
|
||||
"/css/reference/ref-filled-green-100px-square-only.html",
|
||||
"=="
|
||||
]
|
||||
],
|
||||
{}
|
||||
]
|
||||
]
|
||||
},
|
||||
"svg-intrinsic-size-005.html": [
|
||||
|
|
|
@ -1,2 +0,0 @@
|
|||
[positioned-replaced-1.html]
|
||||
expected: FAIL
|
18
tests/wpt/tests/css/css-sizing/stretch/positioned-replaced-2.html
vendored
Normal file
18
tests/wpt/tests/css/css-sizing/stretch/positioned-replaced-2.html
vendored
Normal file
|
@ -0,0 +1,18 @@
|
|||
<!DOCTYPE html>
|
||||
<link rel="author" title="Oriol Brufau" href="mailto:obrufau@igalia.com">
|
||||
<link rel="match" href="../../reference/ref-filled-green-100px-square-only.html">
|
||||
<link rel="help" href="https://github.com/servo/servo/pull/34430">
|
||||
<p>Test passes if there is a filled green square.</p>
|
||||
<style>
|
||||
canvas {
|
||||
position: absolute;
|
||||
background: green;
|
||||
width: stretch;
|
||||
height: stretch;
|
||||
top: 50px;
|
||||
left: 50px;
|
||||
}
|
||||
</style>
|
||||
<div style="display: flow-root; position: relative; width: 150px; height: 150px; margin-top: -50px; margin-left: -50px;">
|
||||
<canvas width="50" height="25"></canvas>
|
||||
</div>
|
17
tests/wpt/tests/css/css-sizing/stretch/positioned-replaced-3.html
vendored
Normal file
17
tests/wpt/tests/css/css-sizing/stretch/positioned-replaced-3.html
vendored
Normal file
|
@ -0,0 +1,17 @@
|
|||
<!DOCTYPE html>
|
||||
<link rel="author" title="Oriol Brufau" href="mailto:obrufau@igalia.com">
|
||||
<link rel="match" href="../../reference/ref-filled-green-100px-square-only.html">
|
||||
<link rel="help" href="https://github.com/servo/servo/pull/34430">
|
||||
<p>Test passes if there is a filled green square.</p>
|
||||
<style>
|
||||
canvas {
|
||||
position: absolute;
|
||||
background: green;
|
||||
width: stretch;
|
||||
height: stretch;
|
||||
inset: 50px;
|
||||
}
|
||||
</style>
|
||||
<div style="display: flow-root; position: relative; width: 200px; height: 200px; margin-top: -50px; margin-left: -50px;">
|
||||
<canvas width="50" height="25"></canvas>
|
||||
</div>
|
Loading…
Add table
Add a link
Reference in a new issue