Index: third_party/WebKit/LayoutTests/fast/css-grid-layout/positioned-grid-items-sizing.html |
diff --git a/third_party/WebKit/LayoutTests/fast/css-grid-layout/positioned-grid-items-sizing.html b/third_party/WebKit/LayoutTests/fast/css-grid-layout/positioned-grid-items-sizing.html |
new file mode 100644 |
index 0000000000000000000000000000000000000000..e9b6de02bfd23841608bfc2450b0b5de0784f2b4 |
--- /dev/null |
+++ b/third_party/WebKit/LayoutTests/fast/css-grid-layout/positioned-grid-items-sizing.html |
@@ -0,0 +1,70 @@ |
+<!DOCTYPE html> |
+<link rel="match" href="positioned-grid-items-sizing-expected.html"> |
+<link href="resources/grid.css" rel="stylesheet"> |
+<style> |
+ |
+.grid { |
+ grid: 25px 50px / 100px 60px; |
+ margin: 1px 2px 3px 4px; |
+ padding: 6px 3px 9px 12px; |
+ border: solid; |
+ border-width: 8px 2px 4px 6px; |
+ font: 10px/1 Ahem; |
+ float: left; |
+ inline-size: 200px; |
+ block-size: 100px; |
+ /* Ensures that the grid container is the containing block of the absolutely positioned grid children. */ |
+ position: relative; |
+} |
+ |
+.grid > div { |
+ position: absolute; |
+} |
+ |
+ |
+</style> |
+ |
+<p>This test checks that the sizing of positioned grid items without specific dimensions or offsets is equivalent to the size of regular items.</p> |
+<p>The test passes if it has the same output than the reference.</p> |
+ |
+<div class="grid"> |
+ <div class="onlyFirstRowOnlyFirstColumn">XXX XX X XX XXX</div> |
+ <div class="onlyFirstRowOnlySecondColumn">XXX XX X XX XXX</div> |
+ <div class="onlySecondRowOnlyFirstColumn">XXX XX X XX XXX</div> |
+ <div class="onlySecondRowOnlySecondColumn">XXX XX X XX XXX</div> |
+</div> |
+ |
+<div class="grid directionRTL"> |
+ <div class="onlyFirstRowOnlyFirstColumn">XXX XX X XX XXX</div> |
+ <div class="onlyFirstRowOnlySecondColumn">XXX XX X XX XXX</div> |
+ <div class="onlySecondRowOnlyFirstColumn">XXX XX X XX XXX</div> |
+ <div class="onlySecondRowOnlySecondColumn">XXX XX X XX XXX</div> |
+</div> |
+ |
+<div class="grid verticalLR"> |
+ <div class="onlyFirstRowOnlyFirstColumn">XXX XX X XX XXX</div> |
+ <div class="onlyFirstRowOnlySecondColumn">XXX XX X XX XXX</div> |
+ <div class="onlySecondRowOnlyFirstColumn">XXX XX X XX XXX</div> |
+ <div class="onlySecondRowOnlySecondColumn">XXX XX X XX XXX</div> |
+</div> |
+ |
+<div class="grid verticalLR directionRTL"> |
+ <div class="onlyFirstRowOnlyFirstColumn">XXX XX X XX XXX</div> |
+ <div class="onlyFirstRowOnlySecondColumn">XXX XX X XX XXX</div> |
+ <div class="onlySecondRowOnlyFirstColumn">XXX XX X XX XXX</div> |
+ <div class="onlySecondRowOnlySecondColumn">XXX XX X XX XXX</div> |
+</div> |
+ |
+<div class="grid verticalRL"> |
+ <div class="onlyFirstRowOnlyFirstColumn">XXX XX X XX XXX</div> |
+ <div class="onlyFirstRowOnlySecondColumn">XXX XX X XX XXX</div> |
+ <div class="onlySecondRowOnlyFirstColumn">XXX XX X XX XXX</div> |
+ <div class="onlySecondRowOnlySecondColumn">XXX XX X XX XXX</div> |
+</div> |
+ |
+<div class="grid verticalRL directionRTL"> |
+ <div class="onlyFirstRowOnlyFirstColumn">XXX XX X XX XXX</div> |
+ <div class="onlyFirstRowOnlySecondColumn">XXX XX X XX XXX</div> |
+ <div class="onlySecondRowOnlyFirstColumn">XXX XX X XX XXX</div> |
+ <div class="onlySecondRowOnlySecondColumn">XXX XX X XX XXX</div> |
+</div> |