third_party/WebKit/LayoutTests/external/wpt/css/css-grid-1/alignment/grid-self-alignment-stretch-vertical-rl-001.html - Issue 2919473002: [css-grid] Apply flow-aware logic for margins during stretching

Unified Diff: third_party/WebKit/LayoutTests/external/wpt/css/css-grid-1/alignment/grid-self-alignment-stretch-vertical-rl-001.html

Issue 2919473002: [css-grid] Apply flow-aware logic for margins during stretching (Closed)

Patch Set: Created 3 years, 7 months ago

Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.

Jump to:

View side-by-side diff with in-line comments

« no previous file with comments | « third_party/WebKit/LayoutTests/external/wpt/css/css-grid-1/alignment/grid-self-alignment-stretch-vertical-lr-016.html ('k') | third_party/WebKit/LayoutTests/external/wpt/css/css-grid-1/alignment/grid-self-alignment-stretch-vertical-rl-002.html » ('j') | no next file with comments »
Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')

Index: third_party/WebKit/LayoutTests/external/wpt/css/css-grid-1/alignment/grid-self-alignment-stretch-vertical-rl-001.html

diff --git a/third_party/WebKit/LayoutTests/external/wpt/css/css-grid-1/alignment/grid-self-alignment-stretch-vertical-rl-001.html b/third_party/WebKit/LayoutTests/external/wpt/css/css-grid-1/alignment/grid-self-alignment-stretch-vertical-rl-001.html

new file mode 100644

index 0000000000000000000000000000000000000000..1afde93aa8681e1239b532ac7848a1f855129e43

--- /dev/null

+++ b/third_party/WebKit/LayoutTests/external/wpt/css/css-grid-1/alignment/grid-self-alignment-stretch-vertical-rl-001.html

@@ -0,0 +1,58 @@

+<!DOCTYPE html>

+<meta charset="utf-8">

+<title>CSS Grid Layout Test: Self-Alignment and stretch on fixed-sized tracks</title>

+<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com">

+<link rel="help" href="https://drafts.csswg.org/css-align-3/#propdef-align-self">

+<link rel="help" href="https://drafts.csswg.org/css-align-3/#propdef-justify-self">

+<link rel="help" href="https://drafts.csswg.org/css-align/#valdef-justify-self-stretch">

+<link rel="help" href="https://drafts.csswg.org/css-align/#valdef-align-self-stretch">

+<meta name="assert" content="Grid items with 'stretch' value for align-self and/or justify-self are stretched along the column and/or row axis respectively; they will be sized as fit-content otherwise.">

+<style>

+.grid {

+ position: relative;

+ display: inline-grid;

+ grid-template-columns: 100px 150px;

+ grid-template-rows: 150px 100px;

+ font: 10px/1 Ahem;

+ background: grey;

+ writing-mode: vertical-rl;

+.firstRowFirstColumn {

+ grid-row: 1;

+ grid-column: 1;

+ background: green;

+ justify-self: stretch;

+ align-self: start;

+.firstRowSecondColumn {

+ grid-row: 1;

+ grid-column: 2;

+ background: blue;

+ justify-self: start;

+ align-self: stretch;

+.secondRowFirstColumn {

+ grid-row: 2;

+ grid-column: 1;

+ background: yellow;

+ justify-self: start;

+ align-self: start;

+.secondRowSecondColumn {

+ grid-row: 2;

+ grid-column: 2;

+ background: red;

+ justify-self: stretch;

+ align-self: stretch;

+</style>

+<script src="/resources/testharness.js"></script>

+<script src="/resources/testharnessreport.js"></script>

+<script src="../support/check-layout-th.js"></script>

+<body onload="checkLayout('.grid')">

+<div class="grid">

+ <div data-offset-x="240" data-offset-y="0" data-expected-width="10" data-expected-height="100" class="firstRowFirstColumn">X XX X</div>

+ <div data-offset-x="100" data-offset-y="100" data-expected-width="150" data-expected-height="60" class="firstRowSecondColumn">XX X<br>X XXX<br>X<br>XX XXX</div>

+ <div data-offset-x="90" data-offset-y="0" data-expected-width="10" data-expected-height="60" class="secondRowFirstColumn">X XX X</div>

+ <div data-offset-x="0" data-offset-y="100" data-expected-width="100" data-expected-height="150" class="secondRowSecondColumn">XX X<br>X XXX<br>X<br>XX XXX</div>

+</div>