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

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-container-margin-border-padding-scrollbar.html

Issue 1488493003: [css-grid] refactoring of layout tests (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Created 5 years 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
« third_party/WebKit/LayoutTests/fast/css-grid-layout/calc-resolution-grid-item.html ('K') | « third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-columns-rows-get-set-multiple.html ('k') | third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-container-width-should-include-scroll-bar-width.html » ('j') | third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-element-shrink-to-fit.html » ('J')
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <html> 2 <html>
3 <head> 3 <head>
4 <link href="../css-intrinsic-dimensions/resources/width-keyword-classes.css" rel ="stylesheet">
5 <link href="../css-intrinsic-dimensions/resources/height-keyword-classes.css" re l="stylesheet">
4 <link href="resources/grid.css" rel="stylesheet"> 6 <link href="resources/grid.css" rel="stylesheet">
5 <style> 7 <style>
6 .grid {
7 width: -webkit-min-content;
8 height: -webkit-min-content;
9 }
10
11 .margin { 8 .margin {
12 margin: 10px; 9 margin: 10px;
13 } 10 }
14 11
15 .border { 12 .border {
16 border: 5px solid black; 13 border: 5px solid black;
17 } 14 }
18 15
19 .padding { 16 .padding {
20 padding: 20px; 17 padding: 20px;
21 } 18 }
22 19
23 .scroll { 20 .scroll {
24 overflow: scroll; 21 overflow: scroll;
25 } 22 }
26 23
27 .item { 24 .item {
28 width: 100px; 25 width: 100px;
29 height: 100px; 26 height: 100px;
30 background: lime; 27 background: lime;
31 } 28 }
32 </style> 29 </style>
33 <script src="../../resources/check-layout.js"></script> 30 <script src="../../resources/check-layout.js"></script>
34 </head> 31 </head>
35 <body onload="checkLayout('.grid');"> 32 <body onload="checkLayout('.grid');">
36 <p>This test checks that grid container size includes border, padding and sc rollbar; ignoring margin as expected.</p> 33 <p>This test checks that grid container size includes border, padding and sc rollbar; ignoring margin as expected.</p>
37 34
38 <div class="grid" data-expected-width="100" data-expected-height="100"> 35 <div class="grid min-content" data-expected-width="100" data-expected-height ="100">
39 <div class="item" data-expected-width="100" data-expected-height="100">< /div> 36 <div class="item" data-expected-width="100" data-expected-height="100">< /div>
40 </div> 37 </div>
41 38
42 <div class="grid margin" data-expected-width="100" data-expected-height="100 "> 39 <div class="grid min-content margin" data-expected-width="100" data-expected -height="100">
43 <div class="item" data-expected-width="100" data-expected-height="100">< /div> 40 <div class="item" data-expected-width="100" data-expected-height="100">< /div>
44 </div> 41 </div>
45 42
46 <div class="grid border" data-expected-width="110" data-expected-height="110 "> 43 <div class="grid min-content border" data-expected-width="110" data-expected -height="110">
47 <div class="item" data-expected-width="100" data-expected-height="100">< /div> 44 <div class="item" data-expected-width="100" data-expected-height="100">< /div>
48 </div> 45 </div>
49 46
50 <div class="grid padding" data-expected-width="140" data-expected-height="14 0"> 47 <div class="grid min-content padding" data-expected-width="140" data-expecte d-height="140">
51 <div class="item" data-expected-width="100" data-expected-height="100">< /div> 48 <div class="item" data-expected-width="100" data-expected-height="100">< /div>
52 </div> 49 </div>
53 50
54 <div class="grid scroll" data-expected-width="115" data-expected-height="115 "> 51 <div class="grid min-content scroll" data-expected-width="115" data-expected -height="115">
55 <div class="item" data-expected-width="100" data-expected-height="100">< /div> 52 <div class="item" data-expected-width="100" data-expected-height="100">< /div>
56 </div> 53 </div>
57 54
58 <div class="grid margin border" data-expected-width="110" data-expected-heig ht="110"> 55 <div class="grid min-content margin border" data-expected-width="110" data-e xpected-height="110">
59 <div class="item" data-expected-width="100" data-expected-height="100">< /div> 56 <div class="item" data-expected-width="100" data-expected-height="100">< /div>
60 </div> 57 </div>
61 58
62 <div class="grid margin padding" data-expected-width="140" data-expected-hei ght="140"> 59 <div class="grid min-content margin padding" data-expected-width="140" data- expected-height="140">
63 <div class="item" data-expected-width="100" data-expected-height="100">< /div> 60 <div class="item" data-expected-width="100" data-expected-height="100">< /div>
64 </div> 61 </div>
65 62
66 <div class="grid margin scroll" data-expected-width="115" data-expected-heig ht="115"> 63 <div class="grid min-content margin scroll" data-expected-width="115" data-e xpected-height="115">
67 <div class="item" data-expected-width="100" data-expected-height="100">< /div> 64 <div class="item" data-expected-width="100" data-expected-height="100">< /div>
68 </div> 65 </div>
69 66
70 <div class="grid border padding" data-expected-width="150" data-expected-hei ght="150"> 67 <div class="grid min-content border padding" data-expected-width="150" data- expected-height="150">
71 <div class="item" data-expected-width="100" data-expected-height="100">< /div> 68 <div class="item" data-expected-width="100" data-expected-height="100">< /div>
72 </div> 69 </div>
73 70
74 <div class="grid border scroll" data-expected-width="125" data-expected-heig ht="125"> 71 <div class="grid min-content border scroll" data-expected-width="125" data-e xpected-height="125">
75 <div class="item" data-expected-width="100" data-expected-height="100">< /div> 72 <div class="item" data-expected-width="100" data-expected-height="100">< /div>
76 </div> 73 </div>
77 74
78 <div class="grid padding scroll" data-expected-width="155" data-expected-hei ght="155"> 75 <div class="grid min-content padding scroll" data-expected-width="155" data- expected-height="155">
79 <div class="item" data-expected-width="100" data-expected-height="100">< /div> 76 <div class="item" data-expected-width="100" data-expected-height="100">< /div>
80 </div> 77 </div>
81 78
82 <div class="grid margin border padding" data-expected-width="150" data-expec ted-height="150"> 79 <div class="grid min-content margin border padding" data-expected-width="150 " data-expected-height="150">
83 <div class="item" data-expected-width="100" data-expected-height="100">< /div> 80 <div class="item" data-expected-width="100" data-expected-height="100">< /div>
84 </div> 81 </div>
85 82
86 <div class="grid margin border scroll" data-expected-width="125" data-expect ed-height="125"> 83 <div class="grid min-content margin border scroll" data-expected-width="125" data-expected-height="125">
87 <div class="item" data-expected-width="100" data-expected-height="100">< /div> 84 <div class="item" data-expected-width="100" data-expected-height="100">< /div>
88 </div> 85 </div>
89 86
90 <div class="grid margin padding scroll" data-expected-width="155" data-expec ted-height="155"> 87 <div class="grid min-content margin padding scroll" data-expected-width="155 " data-expected-height="155">
91 <div class="item" data-expected-width="100" data-expected-height="100">< /div> 88 <div class="item" data-expected-width="100" data-expected-height="100">< /div>
92 </div> 89 </div>
93 90
94 <div class="grid border padding scroll" data-expected-width="165" data-expec ted-height="165"> 91 <div class="grid min-content border padding scroll" data-expected-width="165 " data-expected-height="165">
95 <div class="item" data-expected-width="100" data-expected-height="100">< /div> 92 <div class="item" data-expected-width="100" data-expected-height="100">< /div>
96 </div> 93 </div>
97 94
98 <div class="grid margin border padding scroll" data-expected-width="165" dat a-expected-height="165"> 95 <div class="grid min-content margin border padding scroll" data-expected-wid th="165" data-expected-height="165">
99 <div class="item" data-expected-width="100" data-expected-height="100">< /div> 96 <div class="item" data-expected-width="100" data-expected-height="100">< /div>
100 </div> 97 </div>
101 98
102 </body> 99 </body>
103 </html> 100 </html>
OLDNEW
« third_party/WebKit/LayoutTests/fast/css-grid-layout/calc-resolution-grid-item.html ('K') | « third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-columns-rows-get-set-multiple.html ('k') | third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-container-width-should-include-scroll-bar-width.html » ('j') | third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-element-shrink-to-fit.html » ('J')

Powered by Google App Engine
This is Rietveld 408576698