| OLD | NEW |
|---|
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 <html> | 2 <html> |
| 3 <head> | 3 <head> |
| 4 <link href="resources/grid.css" rel="stylesheet"> | 4 <link href="resources/grid.css" rel="stylesheet"> |
| 5 <style> | 5 <style> |
| 6 .gridWithoutRepeat { | 6 .gridWithoutRepeat { |
| 7 grid-template-columns: (a) 50px (b) 100px (c) 200px (d); | 7 grid-template-columns: [a] 50px [b] 100px [c] 200px [d]; |
| 8 grid-template-rows: (e) 50px (f) 100px (g) 200px (h); | 8 grid-template-rows: [e] 50px [f] 100px [g] 200px [h]; |
| 9 } | 9 } |
| 10 | 10 |
| 11 .gridWithRepeat { | 11 .gridWithRepeat { |
| 12 grid-template-columns: (b) 50px (b) 100px (b) 200px (b); | 12 grid-template-columns: [b] 50px [b] 100px [b] 200px [b]; |
| 13 grid-template-rows: (g) 50px (g) 100px (g) 200px (g); | 13 grid-template-rows: [g] 50px [g] 100px [g] 200px [g]; |
| 14 } | 14 } |
| 15 | 15 |
| 16 .gridFromSpecs { | 16 .gridFromSpecs { |
| 17 grid-template-columns: (A) 10px (B) 20px (C) 30px (A) 40px (B) 50px (C) 60px
(A) 70px (B) 80px (C); | 17 grid-template-columns: [A] 10px [B] 20px [C] 30px [A] 40px [B] 50px [C] 60px
[A] 70px [B] 80px [C]; |
| 18 grid-template-rows: 100px; | 18 grid-template-rows: 100px; |
| 19 } | 19 } |
| 20 | 20 |
| 21 .gridItemBToD { | 21 .gridItemBToD { |
| 22 grid-column: b / d; | 22 grid-column: b / d; |
| 23 grid-row: 1; | 23 grid-row: 1; |
| 24 } | 24 } |
| 25 | 25 |
| 26 .gridItemGToH { | 26 .gridItemGToH { |
| 27 grid-column: 1; | 27 grid-column: 1; |
| (...skipping 172 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 200 </div> | 200 </div> |
| 201 | 201 |
| 202 <div style="position: relative"> | 202 <div style="position: relative"> |
| 203 <div class="grid gridFromSpecs"> | 203 <div class="grid gridFromSpecs"> |
| 204 <div class="sizedToGridArea" style="grid-column: B 2 / span 1;" data-offse
t-x="100" data-expected-width="50"></div> | 204 <div class="sizedToGridArea" style="grid-column: B 2 / span 1;" data-offse
t-x="100" data-expected-width="50"></div> |
| 205 </div> | 205 </div> |
| 206 </div> | 206 </div> |
| 207 | 207 |
| 208 </body> | 208 </body> |
| 209 </html> | 209 </html> |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 1168453002:
[CSSGridLayout] Switch from parentheses to brackets for grid line names (Closed)
Base URL: https://chromium.googlesource.com/chromium/blink.git@master