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

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-intrinsic-maximums-expected.html

Issue 2407243002: [css-grid] Use min-size instead of min-content for intrinsic maximums (Closed)
Patch Set: Created 4 years, 2 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 | « third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-intrinsic-maximums.html ('k') | 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 2
3 <link href="resources/grid.css" rel="stylesheet"> 3 <link href="resources/grid.css" rel="stylesheet">
4 <link href="../css-intrinsic-dimensions/resources/width-keyword-classes.css" rel ="stylesheet"> 4 <link href="../css-intrinsic-dimensions/resources/width-keyword-classes.css" rel ="stylesheet">
5 5
6 <style> 6 <style>
7 7
8 .item { 8 .item {
9 font: 10px/1 Ahem; 9 font: 10px/1 Ahem;
10 background: cyan; 10 background: cyan;
(...skipping 22 matching lines...) Expand all
33 } 33 }
34 34
35 .col1 { grid-column: 1 / 2; background: orange; } 35 .col1 { grid-column: 1 / 2; background: orange; }
36 .col2 { grid-column: 2 / 3; background: indigo; } 36 .col2 { grid-column: 2 / 3; background: indigo; }
37 .col3 { grid-column: 3 / 4; background: green; } 37 .col3 { grid-column: 3 / 4; background: green; }
38 38
39 </style> 39 </style>
40 40
41 <div class="float"> 41 <div class="float">
42 42
43 <!-- Fails due to https://bugs.chromium.org/p/chromium/issues/detail?id=654737 - ->
44 <!--
45 <div class="grid" style="grid-template: 20px / 10px 5px;"> 43 <div class="grid" style="grid-template: 20px / 10px 5px;">
46 <div class="item" style="min-width: 15px;">XXXX XXXX</div> 44 <div class="item" style="min-width: 15px;">XXXX XXXX</div>
47 <div class="abs col1"></div> 45 <div class="abs col1"></div>
48 <div class="abs col2"></div> 46 <div class="abs col2"></div>
49 </div> 47 </div>
50 -->
51 48
52 <div class="grid" style="grid-template: 20px / 50px 5px;"> 49 <div class="grid" style="grid-template: 20px / 50px 5px;">
53 <div class="item" style="min-width: 55px;">XXXX XXXX</div> 50 <div class="item" style="min-width: 55px;">XXXX XXXX</div>
54 <div class="abs col1"></div> 51 <div class="abs col1"></div>
55 <div class="abs col2"></div> 52 <div class="abs col2"></div>
56 </div> 53 </div>
57 54
58 <!-- Fails due to https://bugs.chromium.org/p/chromium/issues/detail?id=654737 - ->
59 <!--
60 <div class="grid" style="grid-template: 20px / 85px 5px;"> 55 <div class="grid" style="grid-template: 20px / 85px 5px;">
61 <div class="item min-width-max-content">XXXX XXXX</div> 56 <div class="item min-width-max-content">XXXX XXXX</div>
62 <div class="abs col1"></div> 57 <div class="abs col1"></div>
63 <div class="abs col2"></div> 58 <div class="abs col2"></div>
64 </div> 59 </div>
65 -->
66 60
67 <div class="grid" style="grid-template: 20px / 5px 85px;"> 61 <div class="grid" style="grid-template: 20px / 5px 85px;">
68 <div class="item" style="min-width: 15px;">XXXX XXXX</div> 62 <div class="item" style="min-width: 15px;">XXXX XXXX</div>
69 <div class="abs col1"></div> 63 <div class="abs col1"></div>
70 <div class="abs col2"></div> 64 <div class="abs col2"></div>
71 </div> 65 </div>
72 66
73 <div class="grid" style="grid-template: 20px / 5px 85px;"> 67 <div class="grid" style="grid-template: 20px / 5px 85px;">
74 <div class="item" style="min-width: 55px;">XXXX XXXX</div> 68 <div class="item" style="min-width: 55px;">XXXX XXXX</div>
75 <div class="abs col1"></div> 69 <div class="abs col1"></div>
76 <div class="abs col2"></div> 70 <div class="abs col2"></div>
77 </div> 71 </div>
78 72
79 <div class="grid" style="grid-template: 20px / 5px 85px;"> 73 <div class="grid" style="grid-template: 20px / 5px 85px;">
80 <div class="item min-width-max-content">XXXX XXXX</div> 74 <div class="item min-width-max-content">XXXX XXXX</div>
81 <div class="abs col1"></div> 75 <div class="abs col1"></div>
82 <div class="abs col2"></div> 76 <div class="abs col2"></div>
83 </div> 77 </div>
84 78
85 </div> 79 </div>
86 80
87 <div class="float"> 81 <div class="float">
88 82
89 <!-- Fails due to https://bugs.chromium.org/p/chromium/issues/detail?id=654737 - ->
90 <!--
91 <div class="grid" style="grid-template: 20px / repeat(2, 5px) 80px;"> 83 <div class="grid" style="grid-template: 20px / repeat(2, 5px) 80px;">
92 <div class="item" style="min-width: 15px;">XXXX XXXX</div> 84 <div class="item" style="min-width: 15px;">XXXX XXXX</div>
93 <div class="abs col1"></div> 85 <div class="abs col1"></div>
94 <div class="abs col2"></div> 86 <div class="abs col2"></div>
95 <div class="abs col3"></div> 87 <div class="abs col3"></div>
96 </div> 88 </div>
97 -->
98 89
99 <div class="grid" style="grid-template: 20px / 25px 5px 60px;"> 90 <div class="grid" style="grid-template: 20px / 25px 5px 60px;">
100 <div class="item" style="min-width: 55px;">XXXX XXXX</div> 91 <div class="item" style="min-width: 55px;">XXXX XXXX</div>
101 <div class="abs col1"></div> 92 <div class="abs col1"></div>
102 <div class="abs col2"></div> 93 <div class="abs col2"></div>
103 <div class="abs col3"></div> 94 <div class="abs col3"></div>
104 </div> 95 </div>
105 96
106 <!-- Fails due to https://bugs.chromium.org/p/chromium/issues/detail?id=654737 - ->
107 <!--
108 <div class="grid" style="grid-template: 20px / calc(85px / 2) 5px calc(85px / 2) ;"> 97 <div class="grid" style="grid-template: 20px / calc(85px / 2) 5px calc(85px / 2) ;">
109 <div class="item min-width-max-content">XXXX XXXX</div> 98 <div class="item min-width-max-content">XXXX XXXX</div>
110 <div class="abs col1"></div> 99 <div class="abs col1"></div>
111 <div class="abs col2"></div> 100 <div class="abs col2"></div>
112 <div class="abs col3"></div> 101 <div class="abs col3"></div>
113 </div> 102 </div>
114 -->
115 103
116 <!-- Fails due to https://bugs.chromium.org/p/chromium/issues/detail?id=654737 - ->
117 <!--
118 <div class="grid" style="grid-template: 20px / 90px repeat(2, 5px);"> 104 <div class="grid" style="grid-template: 20px / 90px repeat(2, 5px);">
119 <div class="item" style="min-width: 15px;">XXXX XXXX</div> 105 <div class="item" style="min-width: 15px;">XXXX XXXX</div>
120 <div class="abs col1"></div> 106 <div class="abs col1"></div>
121 <div class="abs col2"></div> 107 <div class="abs col2"></div>
122 <div class="abs col3"></div> 108 <div class="abs col3"></div>
123 </div> 109 </div>
124 -->
125 110
126 <div class="grid" style="grid-template: 20px / 70px 5px 25px;"> 111 <div class="grid" style="grid-template: 20px / 70px 5px 25px;">
127 <div class="item" style="min-width: 55px;">XXXX XXXX</div> 112 <div class="item" style="min-width: 55px;">XXXX XXXX</div>
128 <div class="abs col1"></div> 113 <div class="abs col1"></div>
129 <div class="abs col2"></div> 114 <div class="abs col2"></div>
130 <div class="abs col3"></div> 115 <div class="abs col3"></div>
131 </div> 116 </div>
132 117
133 <!-- Fails due to https://bugs.chromium.org/p/chromium/issues/detail?id=654737 - ->
134 <!--
135 <div class="grid" style="grid-template: 20px / calc(105px/2) 5px calc(85px/2);" style="justify-items: start"> 118 <div class="grid" style="grid-template: 20px / calc(105px/2) 5px calc(85px/2);" style="justify-items: start">
136 <div class="item min-width-max-content">XXXX XXXX</div> 119 <div class="item min-width-max-content">XXXX XXXX</div>
137 <div class="abs col1"></div> 120 <div class="abs col1"></div>
138 <div class="abs col2"></div> 121 <div class="abs col2"></div>
139 <div class="abs col3"></div> 122 <div class="abs col3"></div>
140 </div> 123 </div>
141 -->
142 124
143 </div> 125 </div>
144 126
145 <div class="float"> 127 <div class="float">
146 128
147 <div class="grid" style="grid-template: 20px / calc(60px - 15px/2) 5px calc(25px + 35px/2);"> 129 <div class="grid" style="grid-template: 20px / calc(60px - 15px/2) 5px calc(25px + 35px/2);">
148 <div class="item" style="min-width: 15px;">XXXX XXXX</div> 130 <div class="item" style="min-width: 15px;">XXXX XXXX</div>
149 <div class="abs col1"></div> 131 <div class="abs col1"></div>
150 <div class="abs col2"></div> 132 <div class="abs col2"></div>
151 <div class="abs col3"></div> 133 <div class="abs col3"></div>
152 </div> 134 </div>
153 135
154 <div class="grid" style="grid-template: 20px / calc(60px + 25px/2) 5px calc(25px - 5px/2);"> 136 <div class="grid" style="grid-template: 20px / calc(60px + 25px/2) 5px calc(25px - 5px/2);">
155 <div class="item" style="min-width: 55px;">XXXX XXXX</div> 137 <div class="item" style="min-width: 55px;">XXXX XXXX</div>
156 <div class="abs col1"></div> 138 <div class="abs col1"></div>
157 <div class="abs col2"></div> 139 <div class="abs col2"></div>
158 <div class="abs col3"></div> 140 <div class="abs col3"></div>
159 </div> 141 </div>
160 142
161 <div class="grid" style="grid-template: 20px / 90px 5px 5px;"> 143 <div class="grid" style="grid-template: 20px / 90px 5px 5px;">
162 <div class="item min-width-max-content">XXXX XXXX</div> 144 <div class="item min-width-max-content">XXXX XXXX</div>
163 <div class="abs col1"></div> 145 <div class="abs col1"></div>
164 <div class="abs col2"></div> 146 <div class="abs col2"></div>
165 <div class="abs col3"></div> 147 <div class="abs col3"></div>
166 </div> 148 </div>
167 149
168 </div> 150 </div>
OLDNEW
« no previous file with comments | « third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-intrinsic-maximums.html ('k') | third_party/WebKit/Source/core/layout/LayoutGrid.cpp » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698