mirror of
https://github.com/servo/servo.git
synced 2025-08-03 12:40:06 +01:00
layout: Let align-content: stretch
fall back to unsafe flex-start
(#37708)
This aligns Servo with other browsers, and adopts this CSSWG resolution: https://github.com/w3c/csswg-drafts/issues/11641#issuecomment-3005385155 Testing: adding new WPT test, and some expectation changes for existing tests. Signed-off-by: Oriol Brufau <obrufau@igalia.com>
This commit is contained in:
parent
d4c0d2ecbb
commit
a9dc2ac83a
5 changed files with 47 additions and 3 deletions
13
tests/wpt/meta/MANIFEST.json
vendored
13
tests/wpt/meta/MANIFEST.json
vendored
|
@ -170987,6 +170987,19 @@
|
|||
{}
|
||||
]
|
||||
],
|
||||
"align-content-007.htm": [
|
||||
"33d217d1671898f43c3e221dd6305401298eab6a",
|
||||
[
|
||||
null,
|
||||
[
|
||||
[
|
||||
"/css/reference/ref-filled-green-200px-square.html",
|
||||
"=="
|
||||
]
|
||||
],
|
||||
{}
|
||||
]
|
||||
],
|
||||
"align-content-wrap-004.html": [
|
||||
"161832190a2a3088ab3b9ad198d4e3083a291551",
|
||||
[
|
||||
|
|
|
@ -1,2 +0,0 @@
|
|||
[flexbox-align-self-baseline-horiz-003.xhtml]
|
||||
expected: FAIL
|
|
@ -5,6 +5,9 @@
|
|||
[.flexbox 11]
|
||||
expected: FAIL
|
||||
|
||||
[.flexbox 5]
|
||||
expected: FAIL
|
||||
|
||||
[.flexbox 8]
|
||||
expected: FAIL
|
||||
|
||||
|
|
30
tests/wpt/tests/css/css-flexbox/align-content-007.htm
vendored
Normal file
30
tests/wpt/tests/css/css-flexbox/align-content-007.htm
vendored
Normal file
|
@ -0,0 +1,30 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Test: Fallback alignment of 'align-content: stretch'</title>
|
||||
<link rel="author" title="Oriol Brufau" href="mailto:obrufau@igalia.com">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-align/#valdef-align-content-stretch">
|
||||
<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/11641">
|
||||
<meta name="assert" content="The fallback alignment for `align-content: stretch` is `flex-start`, not `safe flex-start`.">
|
||||
<link rel="match" href="../reference/ref-filled-green-200px-square.html">
|
||||
|
||||
<style>
|
||||
#flex {
|
||||
display: flex;
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
flex-wrap: wrap-reverse;
|
||||
align-content: stretch;
|
||||
}
|
||||
#item {
|
||||
width: 200px;
|
||||
height: 400px;
|
||||
background: linear-gradient(to bottom, red 50%, green 50%);
|
||||
}
|
||||
</style>
|
||||
|
||||
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
|
||||
<div style="overflow: hidden">
|
||||
<div id="flex">
|
||||
<div id="item"></div>
|
||||
</div>
|
||||
</div>
|
Loading…
Add table
Add a link
Reference in a new issue