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

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: LayoutTests/fast/css-grid-layout/grid-percent-track-margin-border-padding.html

Issue 1321723008: [css-grid] Percentage columns shouldn't include border and padding (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master
Patch Set: New version increasing pixels for margin, border and padding Created 5 years, 3 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 | LayoutTests/fast/css-grid-layout/grid-percent-track-margin-border-padding-expected.txt » ('j') | Source/core/layout/LayoutGrid.cpp » ('J')
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
(Empty)
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <link href="resources/grid.css" rel="stylesheet">
5 <style>
6 .grid {
7 width: 100px;
8 height: 100px;
9 grid-template-columns: 20% 50% 30%;
10 grid-template-rows: 40% 60%;
11 }
12
13 .margin {
14 margin: 10px;
15 }
16
17 .border {
18 border: 5px solid black;
19 }
20
21 .padding {
22 padding: 20px;
23 }
24 </style>
25 <script src="../../resources/check-layout.js"></script>
26 </head>
27 <body onload="checkLayout('.grid');">
28 <p>This test checks that percentage tracks ignore grid container's margin, b order and padding in order to calculate their breadths.</p>
29
30 <div class="grid">
31 <div data-expected-width="20" data-expected-height="40"></div>
32 <div data-expected-width="50" data-expected-height="40"></div>
33 <div data-expected-width="30" data-expected-height="40"></div>
34 <div data-expected-width="20" data-expected-height="60"></div>
35 <div data-expected-width="50" data-expected-height="60"></div>
36 <div data-expected-width="30" data-expected-height="60"></div>
37 </div>
38
39 <div class="grid margin">
40 <div data-expected-width="20" data-expected-height="40"></div>
41 <div data-expected-width="50" data-expected-height="40"></div>
42 <div data-expected-width="30" data-expected-height="40"></div>
43 <div data-expected-width="20" data-expected-height="60"></div>
44 <div data-expected-width="50" data-expected-height="60"></div>
45 <div data-expected-width="30" data-expected-height="60"></div>
46 </div>
47
48 <div class="grid border">
49 <div data-expected-width="20" data-expected-height="40"></div>
50 <div data-expected-width="50" data-expected-height="40"></div>
51 <div data-expected-width="30" data-expected-height="40"></div>
52 <div data-expected-width="20" data-expected-height="60"></div>
53 <div data-expected-width="50" data-expected-height="60"></div>
54 <div data-expected-width="30" data-expected-height="60"></div>
55 </div>
56
57 <div class="grid padding">
58 <div data-expected-width="20" data-expected-height="40"></div>
59 <div data-expected-width="50" data-expected-height="40"></div>
60 <div data-expected-width="30" data-expected-height="40"></div>
61 <div data-expected-width="20" data-expected-height="60"></div>
62 <div data-expected-width="50" data-expected-height="60"></div>
63 <div data-expected-width="30" data-expected-height="60"></div>
64 </div>
65
66 <div class="grid margin border">
67 <div data-expected-width="20" data-expected-height="40"></div>
68 <div data-expected-width="50" data-expected-height="40"></div>
69 <div data-expected-width="30" data-expected-height="40"></div>
70 <div data-expected-width="20" data-expected-height="60"></div>
71 <div data-expected-width="50" data-expected-height="60"></div>
72 <div data-expected-width="30" data-expected-height="60"></div>
73 </div>
74
75 <div class="grid margin padding">
76 <div data-expected-width="20" data-expected-height="40"></div>
77 <div data-expected-width="50" data-expected-height="40"></div>
78 <div data-expected-width="30" data-expected-height="40"></div>
79 <div data-expected-width="20" data-expected-height="60"></div>
80 <div data-expected-width="50" data-expected-height="60"></div>
81 <div data-expected-width="30" data-expected-height="60"></div>
82 </div>
83
84 <div class="grid border padding">
85 <div data-expected-width="20" data-expected-height="40"></div>
86 <div data-expected-width="50" data-expected-height="40"></div>
87 <div data-expected-width="30" data-expected-height="40"></div>
88 <div data-expected-width="20" data-expected-height="60"></div>
89 <div data-expected-width="50" data-expected-height="60"></div>
90 <div data-expected-width="30" data-expected-height="60"></div>
91 </div>
92
93 <div class="grid margin border padding">
94 <div data-expected-width="20" data-expected-height="40"></div>
95 <div data-expected-width="50" data-expected-height="40"></div>
96 <div data-expected-width="30" data-expected-height="40"></div>
97 <div data-expected-width="20" data-expected-height="60"></div>
98 <div data-expected-width="50" data-expected-height="60"></div>
99 <div data-expected-width="30" data-expected-height="60"></div>
100 </div>
101 </body>
102 </html>
OLDNEW
« no previous file with comments | « no previous file | LayoutTests/fast/css-grid-layout/grid-percent-track-margin-border-padding-expected.txt » ('j') | Source/core/layout/LayoutGrid.cpp » ('J')

Powered by Google App Engine
This is Rietveld 408576698