Index: third_party/WebKit/LayoutTests/fast/html/summary-display-inline-grid.html |
diff --git a/third_party/WebKit/LayoutTests/fast/html/summary-display-inline-grid.html b/third_party/WebKit/LayoutTests/fast/html/summary-display-inline-grid.html |
new file mode 100644 |
index 0000000000000000000000000000000000000000..11d32bed5c41f066b55bad96c96e4cae7340cc40 |
--- /dev/null |
+++ b/third_party/WebKit/LayoutTests/fast/html/summary-display-inline-grid.html |
@@ -0,0 +1,71 @@ |
+<!DOCTYPE html> |
+<style> |
+.grid-container { |
+ display: inline-grid; |
+ grid-template-columns: 200px 10px 0.3fr 10px 0.7fr; |
+ grid-template-rows: auto 20px auto; |
+} |
+ |
+.grid-element { |
+ background-color: #444; |
+ color: #fff; |
+ padding: 20px; |
+ font-size: 2em; |
+} |
+ |
+.element-a { |
+ grid-column-start: 1; |
+ grid-column-end: ; |
+ grid-row-start: 1; |
+ grid-row-end: 2; |
+ background: #6F9; |
+} |
+ |
+.element-b { |
+ grid-column-start: 3; |
+ grid-column-end: 4; |
+ grid-row-start: 1; |
+ grid-row-end: 2; |
+ background: #69F; |
+} |
+ |
+.element-c { |
+ grid-column-start: 5; |
+ grid-column-end: 6; |
+ grid-row-start: 1; |
+ grid-row-end: 2; |
+ background: #F69; |
+} |
+ |
+.element-d { |
+ grid-column-start: 1; |
+ grid-column-end: 2; |
+ grid-row-start: 3; |
+ grid-row-end: 4; |
+ background: #9F6; |
+} |
+ |
+.element-e { |
+ grid-column-start: 3; |
+ grid-column-end: 4; |
+ grid-row-start: 3; |
+ grid-row-end: 4; |
+ background: #96F; |
+} |
+ |
+.element-f { |
+ grid-column-start: 5; |
+ grid-column-end: 6; |
+ grid-row-start: 3; |
+ grid-row-end: 4; |
+ background: #F96; |
+} |
+</style> |
+<summary class="grid-container"> |
+ <div class="grid-element element-a">A</div> |
+ <div class="grid-element element-b">B</div> |
+ <div class="grid-element element-c">C</div> |
+ <div class="grid-element element-d">D</div> |
+ <div class="grid-element element-e">E</div> |
+ <div class="grid-element element-f">F</div> |
+</summary> |