| Index: third_party/WebKit/LayoutTests/external/csswg-test/css-grid-1/grid-model/display-grid.html
|
| diff --git a/third_party/WebKit/LayoutTests/external/csswg-test/css-grid-1/grid-model/display-grid.html b/third_party/WebKit/LayoutTests/external/csswg-test/css-grid-1/grid-model/display-grid.html
|
| new file mode 100644
|
| index 0000000000000000000000000000000000000000..7c6b743327ebfa74a841add8c51a5ea7ffb73ec4
|
| --- /dev/null
|
| +++ b/third_party/WebKit/LayoutTests/external/csswg-test/css-grid-1/grid-model/display-grid.html
|
| @@ -0,0 +1,107 @@
|
| +<!DOCTYPE HTML>
|
| +<html>
|
| +<head>
|
| + <title>CSS Grid Layout: display: grid</title>
|
| + <link rel="author" title="swain" href="mailto:swainet@126.com"/>
|
| + <link rel="reviewer" title="Dayang Shen" href="mailto:shendayang@baidu.com"/> <!-- 2013-09-17 -->
|
| + <link rel="help" href="http://www.w3.org/TR/css-grid-1/#grid-containers"/>
|
| + <link rel="match" href="../reference/display-grid-ref.html">
|
| + <meta name="assert" content="'display: grid' causes an element to generate a block-level grid container box."/>
|
| + <style type="text/css">
|
| + #container {
|
| + position:relative;
|
| + width:400px;
|
| + height:100px;
|
| + }
|
| +
|
| + #grid {
|
| + display:grid;
|
| + grid-template-columns:100px 300px;
|
| + grid-template-rows:70px 30px;
|
| + height:100%;
|
| + }
|
| +
|
| + #cell1 {
|
| + grid-column:1;
|
| + grid-row:1;
|
| + background-color:green;
|
| + height:70px;
|
| + }
|
| +
|
| + #cell2 {
|
| + grid-column:2;
|
| + grid-row:1;
|
| + background-color:limegreen;
|
| + height:70px;
|
| + }
|
| +
|
| + #cell3 {
|
| + grid-column:1;
|
| + grid-row:2;
|
| + background-color:limegreen;
|
| + height:30px;
|
| + }
|
| +
|
| + #cell4 {
|
| + grid-column:2;
|
| + grid-row:2;
|
| + background-color:green;
|
| + height:30px;
|
| + }
|
| +
|
| + .error {
|
| + position:absolute;
|
| + top:0;
|
| + left:0;
|
| + height:100%;
|
| + width:100%;
|
| + z-index:-1;
|
| + }
|
| +
|
| + #table {
|
| + width:100%;
|
| + height:100%;
|
| + border-collapse:collapse;
|
| + }
|
| +
|
| + #table td {
|
| + padding:0;
|
| + vertical-align:top;
|
| + }
|
| +
|
| + #table td:first-child {
|
| + width:100px;
|
| + }
|
| +
|
| + #table tr:last-child td {
|
| + height:30px;
|
| + }
|
| + </style>
|
| +</head>
|
| +<body>
|
| +<p>Test passes if there are 4 green rectangles and no red.</p>
|
| +
|
| +<div id="container">
|
| + <div id="grid">
|
| + <div id="cell1">cell1</div>
|
| + <div id="cell2">cell2</div>
|
| + <div id="cell3">cell3</div>
|
| + <div id="cell4">cell4</div>
|
| + </div>
|
| + <div class="error">
|
| + <table id="table">
|
| + <tbody>
|
| + <tr>
|
| + <td style="background-color:#f00">cell1</td>
|
| + <td style="background-color:#e00">cell2</td>
|
| + </tr>
|
| + <tr>
|
| + <td style="background-color:#e00">cell3</td>
|
| + <td style="background-color:#f00">cell4</td>
|
| + </tr>
|
| + </tbody>
|
| + </table>
|
| + </div>
|
| +</div>
|
| +</body>
|
| +</html>
|
|
|