Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(370)

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-positioned-items-within-grid-implicit-track.html

Issue 2021683002: [css-grid] Positioned items can be placed on the implicit grid (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Created 4 years, 6 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 unified diff | Download patch
« no previous file with comments | « no previous file | third_party/WebKit/Source/core/layout/LayoutGrid.cpp » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <link href="resources/grid.css" rel="stylesheet"> 2 <link href="resources/grid.css" rel="stylesheet">
3 <style> 3 <style>
4 4
5 .grid { 5 .grid {
6 grid-template-columns: 200px 300px; 6 grid-template-columns: 200px 300px;
7 grid-template-rows: 150px 250px; 7 grid-template-rows: 150px 250px;
8 grid-auto-columns: 100px; 8 grid-auto-columns: 100px;
9 grid-auto-rows: 50px; 9 grid-auto-rows: 50px;
10 width: 800px; 10 width: 800px;
(...skipping 20 matching lines...) Expand all
31 grid-column: -5 / 5; 31 grid-column: -5 / 5;
32 } 32 }
33 33
34 </style> 34 </style>
35 <script src="../../resources/testharness.js"></script> 35 <script src="../../resources/testharness.js"></script>
36 <script src="../../resources/testharnessreport.js"></script> 36 <script src="../../resources/testharnessreport.js"></script>
37 <script src="../../resources/check-layout-th.js"></script> 37 <script src="../../resources/check-layout-th.js"></script>
38 <body onload="checkLayout('.grid')"> 38 <body onload="checkLayout('.grid')">
39 <div id="log"></div> 39 <div id="log"></div>
40 40
41 <p>This test checks that positioned grid items are placed properly (ignoring imp licit tracks) even if the grid has implicit tracks.</p> 41 <p>This test checks that positioned grid items are placed properly (including im plicit tracks) even if the grid has implicit tracks.</p>
42 42
43 <div class="grid"> 43 <div class="grid">
44 <div class="sixRowsAndSixColumns" 44 <div class="sixRowsAndSixColumns"
45 data-offset-x="15" data-offset-y="15" data-expected-width="900" data-exp ected-height="600"> 45 data-offset-x="15" data-offset-y="15" data-expected-width="900" data-exp ected-height="600">
46 </div> 46 </div>
47 <div class="absolute" style="grid-column: auto / 1; grid-row: auto / 1;" 47 <div class="absolute" style="grid-column: auto / 1; grid-row: auto / 1;"
48 data-offset-x="0" data-offset-y="0" data-expected-width="215" data-expec ted-height="115"> 48 data-offset-x="0" data-offset-y="0" data-expected-width="215" data-expec ted-height="115">
49 </div> 49 </div>
50 </div> 50 </div>
51 51
(...skipping 22 matching lines...) Expand all
74 <div class="absolute" style="grid-column: 2 / auto; grid-row: 2 / auto;" 74 <div class="absolute" style="grid-column: 2 / auto; grid-row: 2 / auto;"
75 data-offset-x="415" data-offset-y="265" data-expected-width="415" data-e xpected-height="365"> 75 data-offset-x="415" data-offset-y="265" data-expected-width="415" data-e xpected-height="365">
76 </div> 76 </div>
77 </div> 77 </div>
78 78
79 <div class="grid"> 79 <div class="grid">
80 <div class="sixRowsAndSixColumns" 80 <div class="sixRowsAndSixColumns"
81 data-offset-x="15" data-offset-y="15" data-expected-width="900" data-exp ected-height="600"> 81 data-offset-x="15" data-offset-y="15" data-expected-width="900" data-exp ected-height="600">
82 </div> 82 </div>
83 <div class="absolute" style="grid-column: -4 / 1; grid-row: -4 / 1;" 83 <div class="absolute" style="grid-column: -4 / 1; grid-row: -4 / 1;"
84 data-offset-x="0" data-offset-y="0" data-expected-width="215" data-expec ted-height="115"> 84 data-offset-x="115" data-offset-y="65" data-expected-width="100" data-ex pected-height="50">
85 </div> 85 </div>
86 </div> 86 </div>
87 87
88 <div class="grid"> 88 <div class="grid">
89 <div class="sixRowsAndSixColumns" 89 <div class="sixRowsAndSixColumns"
90 data-offset-x="15" data-offset-y="15" data-expected-width="900" data-exp ected-height="600"> 90 data-offset-x="15" data-offset-y="15" data-expected-width="900" data-exp ected-height="600">
91 </div> 91 </div>
92 <div class="absolute" style="grid-column: -4 / 2; grid-row: -4 / 2;" 92 <div class="absolute" style="grid-column: -4 / 2; grid-row: -4 / 2;"
93 data-offset-x="0" data-offset-y="0" data-expected-width="415" data-expec ted-height="265"> 93 data-offset-x="115" data-offset-y="65" data-expected-width="300" data-ex pected-height="200">
94 </div> 94 </div>
95 </div> 95 </div>
96 96
97 <div class="grid"> 97 <div class="grid">
98 <div class="sixRowsAndSixColumns" 98 <div class="sixRowsAndSixColumns"
99 data-offset-x="15" data-offset-y="15" data-expected-width="900" data-exp ected-height="600"> 99 data-offset-x="15" data-offset-y="15" data-expected-width="900" data-exp ected-height="600">
100 </div> 100 </div>
101 <div class="absolute" style="grid-column: 3 / 4; grid-row: 3 / 4;" 101 <div class="absolute" style="grid-column: 3 / 4; grid-row: 3 / 4;"
102 data-offset-x="715" data-offset-y="515" data-expected-width="115" data-e xpected-height="115"> 102 data-offset-x="715" data-offset-y="515" data-expected-width="100" data-e xpected-height="50">
103 </div> 103 </div>
104 </div> 104 </div>
105 105
106 <div class="grid"> 106 <div class="grid">
107 <div class="sixRowsAndSixColumns" 107 <div class="sixRowsAndSixColumns"
108 data-offset-x="15" data-offset-y="15" data-expected-width="900" data-exp ected-height="600"> 108 data-offset-x="15" data-offset-y="15" data-expected-width="900" data-exp ected-height="600">
109 </div> 109 </div>
110 <div class="absolute" style="grid-column: 2 / 4; grid-row: 2 / 4;" 110 <div class="absolute" style="grid-column: 2 / 4; grid-row: 2 / 4;"
111 data-offset-x="415" data-offset-y="265" data-expected-width="415" data-e xpected-height="365"> 111 data-offset-x="415" data-offset-y="265" data-expected-width="400" data-e xpected-height="300">
112 </div> 112 </div>
113 </div> 113 </div>
114 114
115 <div class="grid directionRTL"> 115 <div class="grid directionRTL">
116 <div class="sixRowsAndSixColumns" 116 <div class="sixRowsAndSixColumns"
117 data-offset-x="-85" data-offset-y="15" data-expected-width="900" data-ex pected-height="600"> 117 data-offset-x="-85" data-offset-y="15" data-expected-width="900" data-ex pected-height="600">
118 </div> 118 </div>
119 <div class="absolute" style="grid-column: auto / 1; grid-row: auto / 1;" 119 <div class="absolute" style="grid-column: auto / 1; grid-row: auto / 1;"
120 data-offset-x="615" data-offset-y="0" data-expected-width="215" data-exp ected-height="115"> 120 data-offset-x="615" data-offset-y="0" data-expected-width="215" data-exp ected-height="115">
121 </div> 121 </div>
(...skipping 24 matching lines...) Expand all
146 <div class="absolute" style="grid-column: 2 / auto; grid-row: 2 / auto;" 146 <div class="absolute" style="grid-column: 2 / auto; grid-row: 2 / auto;"
147 data-offset-x="0" data-offset-y="265" data-expected-width="415" data-exp ected-height="365"> 147 data-offset-x="0" data-offset-y="265" data-expected-width="415" data-exp ected-height="365">
148 </div> 148 </div>
149 </div> 149 </div>
150 150
151 <div class="grid directionRTL"> 151 <div class="grid directionRTL">
152 <div class="sixRowsAndSixColumns" 152 <div class="sixRowsAndSixColumns"
153 data-offset-x="-85" data-offset-y="15" data-expected-width="900" data-ex pected-height="600"> 153 data-offset-x="-85" data-offset-y="15" data-expected-width="900" data-ex pected-height="600">
154 </div> 154 </div>
155 <div class="absolute" style="grid-column: -4 / 1; grid-row: -4 / 1;" 155 <div class="absolute" style="grid-column: -4 / 1; grid-row: -4 / 1;"
156 data-offset-x="615" data-offset-y="0" data-expected-width="215" data-exp ected-height="115"> 156 data-offset-x="615" data-offset-y="65" data-expected-width="100" data-ex pected-height="50">
157 </div> 157 </div>
158 </div> 158 </div>
159 159
160 <div class="grid directionRTL"> 160 <div class="grid directionRTL">
161 <div class="sixRowsAndSixColumns" 161 <div class="sixRowsAndSixColumns"
162 data-offset-x="-85" data-offset-y="15" data-expected-width="900" data-ex pected-height="600"> 162 data-offset-x="-85" data-offset-y="15" data-expected-width="900" data-ex pected-height="600">
163 </div> 163 </div>
164 <div class="absolute" style="grid-column: -4 / 2; grid-row: -4 / 2;" 164 <div class="absolute" style="grid-column: -4 / 2; grid-row: -4 / 2;"
165 data-offset-x="415" data-offset-y="0" data-expected-width="415" data-exp ected-height="265"> 165 data-offset-x="415" data-offset-y="65" data-expected-width="300" data-ex pected-height="200">
166 </div> 166 </div>
167 </div> 167 </div>
168 168
169 <div class="grid directionRTL"> 169 <div class="grid directionRTL">
170 <div class="sixRowsAndSixColumns" 170 <div class="sixRowsAndSixColumns"
171 data-offset-x="-85" data-offset-y="15" data-expected-width="900" data-ex pected-height="600"> 171 data-offset-x="-85" data-offset-y="15" data-expected-width="900" data-ex pected-height="600">
172 </div> 172 </div>
173 <div class="absolute" style="grid-column: 3 / 4; grid-row: 3 / 4;" 173 <div class="absolute" style="grid-column: 3 / 4; grid-row: 3 / 4;"
174 data-offset-x="0" data-offset-y="515" data-expected-width="115" data-exp ected-height="115"> 174 data-offset-x="15" data-offset-y="515" data-expected-width="100" data-ex pected-height="50">
175 </div> 175 </div>
176 </div> 176 </div>
177 177
178 <div class="grid directionRTL"> 178 <div class="grid directionRTL">
179 <div class="sixRowsAndSixColumns" 179 <div class="sixRowsAndSixColumns"
180 data-offset-x="-85" data-offset-y="15" data-expected-width="900" data-ex pected-height="600"> 180 data-offset-x="-85" data-offset-y="15" data-expected-width="900" data-ex pected-height="600">
181 </div> 181 </div>
182 <div class="absolute" style="grid-column: 2 / 4; grid-row: 2 / 4;" 182 <div class="absolute" style="grid-column: 2 / 4; grid-row: 2 / 4;"
183 data-offset-x="0" data-offset-y="265" data-expected-width="415" data-exp ected-height="365"> 183 data-offset-x="15" data-offset-y="265" data-expected-width="400" data-ex pected-height="300">
184 </div> 184 </div>
185 </div> 185 </div>
186 186
187 </body> 187 </body>
OLDNEW
« no previous file with comments | « no previous file | third_party/WebKit/Source/core/layout/LayoutGrid.cpp » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698