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

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-element-min-max-width.html

Issue 1583433002: [css-align] New CSS Value 'normal' for Content Alignment (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Fixed layout tests failing. Created 4 years, 10 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-dynamic-updates-relayout.html ('k') | third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-element-repeat-get-set.html » ('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 <html> 2 <html>
3 <link href="resources/grid.css" rel="stylesheet"> 3 <link href="resources/grid.css" rel="stylesheet">
4 <link href="resources/grid-alignment.css" rel="stylesheet">
4 <link href="../css-intrinsic-dimensions/resources/width-keyword-classes.css" rel =stylesheet> 5 <link href="../css-intrinsic-dimensions/resources/width-keyword-classes.css" rel =stylesheet>
5 <style> 6 <style>
6 .minWidthGrid { 7 .minWidthGrid {
7 min-width: 100px; 8 min-width: 100px;
8 grid-template-columns: 50px; 9 grid-template-columns: 50px;
9 grid-template-rows: 40px; 10 grid-template-rows: 40px;
10 } 11 }
11 .maxWidthGrid { 12 .maxWidthGrid {
12 max-width: 100px; 13 max-width: 100px;
13 grid-template-columns: 150px 50px; 14 grid-template-columns: 150px 50px;
14 grid-template-rows: 40px; 15 grid-template-rows: 40px;
15 } 16 }
16 17
17 .minWidthAutoGrid { 18 .minWidthAutoGrid {
18 min-width: 100px; 19 min-width: 100px;
19 } 20 }
20 21
21 .maxWidthAutoGrid { 22 .maxWidthAutoGrid {
22 max-width: 100px; 23 max-width: 100px;
23 } 24 }
24 </style> 25 </style>
25 <script src="../../resources/check-layout.js"></script> 26 <script src="../../resources/check-layout.js"></script>
26 <body onload="checkLayout('.grid')"> 27 <body onload="checkLayout('.grid')">
27 28
28 <p>Test that min-width and max-width are accounted for when computing the grid e lement's preferred widths.</p> 29 <p>Test that min-width and max-width are accounted for when computing the grid e lement's preferred widths.</p>
29 30
30 <div class="constrainedContainer"> 31 <div class="constrainedContainer">
31 <div class="grid minWidthGrid" data-expected-height="40" data-expected-width ="100"></div> 32 <div class="grid minWidthGrid" data-expected-height="40" data-expected-width ="100"></div>
32 <div class="grid minWidthAutoGrid" data-expected-height="10" data-expected-w idth="100"> 33 <div class="grid minWidthAutoGrid justifyContentStart justfyContentStart" da ta-expected-height="10" data-expected-width="100">
33 <div class="sizedToGridArea firstRowFirstColumn" data-expected-height="1 0" data-expected-width="70">XXX XXX</div> 34 <div class="sizedToGridArea firstRowFirstColumn" data-expected-height="1 0" data-expected-width="70">XXX XXX</div>
34 </div> 35 </div>
35 <!-- These 2 grids are sized after their containing block as width is 'auto' . We end up having the content overflow which is weird but the grid shouldn't sh rink to fit by default. --> 36 <!-- These 2 grids are sized after their containing block as width is 'auto' . We end up having the content overflow which is weird but the grid shouldn't sh rink to fit by default. -->
36 <div class="grid maxWidthGrid" data-expected-height="40" data-expected-width ="10"></div> 37 <div class="grid maxWidthGrid" data-expected-height="40" data-expected-width ="10"></div>
37 <div class="grid maxWidthAutoGrid" data-expected-height="10" data-expected-w idth="10"> 38 <div class="grid maxWidthAutoGrid" data-expected-height="10" data-expected-w idth="10">
38 <div class="sizedToGridArea firstRowFirstColumn" data-expected-height="1 0" data-expected-width="110">XXXXXXXXXXX</div> 39 <div class="sizedToGridArea firstRowFirstColumn" data-expected-height="1 0" data-expected-width="110">XXXXXXXXXXX</div>
39 </div> 40 </div>
40 41
41 <div class="grid fit-content minWidthGrid" data-expected-height="40" data-ex pected-width="100"></div> 42 <div class="grid fit-content minWidthGrid" data-expected-height="40" data-ex pected-width="100"></div>
42 <div class="grid fit-content maxWidthGrid" data-expected-height="40" data-ex pected-width="100"></div> 43 <div class="grid fit-content maxWidthGrid" data-expected-height="40" data-ex pected-width="100"></div>
43 44
44 <div class="grid max-content minWidthAutoGrid" data-expected-height="10" dat a-expected-width="110"> 45 <div class="grid max-content minWidthAutoGrid" data-expected-height="10" dat a-expected-width="110">
45 <div class="sizedToGridArea firstRowFirstColumn" data-expected-height="1 0" data-expected-width="110">XXX XXX XXX</div> 46 <div class="sizedToGridArea firstRowFirstColumn" data-expected-height="1 0" data-expected-width="110">XXX XXX XXX</div>
46 </div> 47 </div>
47 <div class="grid min-content minWidthAutoGrid" data-expected-height="20" dat a-expected-width="100"> 48 <div class="grid min-content minWidthAutoGrid" data-expected-height="20" dat a-expected-width="100">
48 <div class="sizedToGridArea firstRowFirstColumn" data-expected-height="2 0" data-expected-width="100">XXX XXX XXX</div> 49 <div class="sizedToGridArea firstRowFirstColumn" data-expected-height="2 0" data-expected-width="100">XXX XXX XXX</div>
49 </div> 50 </div>
50 51
51 <div class="grid max-content maxWidthAutoGrid" data-expected-height="20" dat a-expected-width="100"> 52 <div class="grid max-content maxWidthAutoGrid" data-expected-height="20" dat a-expected-width="100">
52 <div class="sizedToGridArea firstRowFirstColumn" data-expected-height="2 0" data-expected-width="100">XXXXX XXXXXX</div> 53 <div class="sizedToGridArea firstRowFirstColumn" data-expected-height="2 0" data-expected-width="100">XXXXX XXXXXX</div>
53 </div> 54 </div>
54 <div class="grid min-content maxWidthAutoGrid" data-expected-height="20" dat a-expected-width="60"> 55 <div class="grid min-content maxWidthAutoGrid" data-expected-height="20" dat a-expected-width="60">
55 <div class="sizedToGridArea firstRowFirstColumn" data-expected-height="2 0" data-expected-width="60">XXXXX XXXXXX</div> 56 <div class="sizedToGridArea firstRowFirstColumn" data-expected-height="2 0" data-expected-width="60">XXXXX XXXXXX</div>
56 </div> 57 </div>
57 </div> 58 </div>
58 59
59 <div class="unconstrainedContainer"> 60 <div class="unconstrainedContainer">
60 <div class="grid minWidthGrid" data-expected-height="40" data-expected-width ="1000"></div> 61 <div class="grid minWidthGrid" data-expected-height="40" data-expected-width ="1000"></div>
61 <div class="grid minWidthAutoGrid" data-expected-height="10" data-expected-w idth="1000"> 62 <div class="grid minWidthAutoGrid justifyContentStart" data-expected-height= "10" data-expected-width="1000">
62 <div class="sizedToGridArea firstRowFirstColumn" data-expected-height="1 0" data-expected-width="70">XXX XXX</div> 63 <div class="sizedToGridArea firstRowFirstColumn" data-expected-height="1 0" data-expected-width="70">XXX XXX</div>
63 </div> 64 </div>
64 <div class="grid maxWidthGrid" data-expected-height="40" data-expected-width ="100"></div> 65 <div class="grid maxWidthGrid" data-expected-height="40" data-expected-width ="100"></div>
65 <div class="grid maxWidthAutoGrid" data-expected-height="20" data-expected-w idth="100"> 66 <div class="grid maxWidthAutoGrid" data-expected-height="20" data-expected-w idth="100">
66 <div class="sizedToGridArea firstRowFirstColumn" data-expected-height="2 0" data-expected-width="100">XXXXX XXXXXX</div> 67 <div class="sizedToGridArea firstRowFirstColumn" data-expected-height="2 0" data-expected-width="100">XXXXX XXXXXX</div>
67 </div> 68 </div>
68 <div class="grid fit-content minWidthGrid" data-expected-height="40" data-ex pected-width="100"></div> 69 <div class="grid fit-content minWidthGrid" data-expected-height="40" data-ex pected-width="100"></div>
69 <div class="grid fit-content maxWidthGrid" data-expected-height="40" data-ex pected-width="100"></div> 70 <div class="grid fit-content maxWidthGrid" data-expected-height="40" data-ex pected-width="100"></div>
70 71
71 <div class="grid max-content minWidthAutoGrid" data-expected-height="10" dat a-expected-width="110"> 72 <div class="grid max-content minWidthAutoGrid" data-expected-height="10" dat a-expected-width="110">
72 <div class="sizedToGridArea firstRowFirstColumn" data-expected-height="1 0" data-expected-width="110">XXX XXX XXX</div> 73 <div class="sizedToGridArea firstRowFirstColumn" data-expected-height="1 0" data-expected-width="110">XXX XXX XXX</div>
73 </div> 74 </div>
74 <div class="grid min-content minWidthAutoGrid" data-expected-height="20" dat a-expected-width="100"> 75 <div class="grid min-content minWidthAutoGrid" data-expected-height="20" dat a-expected-width="100">
75 <div class="sizedToGridArea firstRowFirstColumn" data-expected-height="2 0" data-expected-width="100">XXX XXX XXX</div> 76 <div class="sizedToGridArea firstRowFirstColumn" data-expected-height="2 0" data-expected-width="100">XXX XXX XXX</div>
76 </div> 77 </div>
77 78
78 <div class="grid max-content maxWidthAutoGrid" data-expected-height="20" dat a-expected-width="100"> 79 <div class="grid max-content maxWidthAutoGrid" data-expected-height="20" dat a-expected-width="100">
79 <div class="sizedToGridArea firstRowFirstColumn" data-expected-height="2 0" data-expected-width="100">XXXXX XXXXXX</div> 80 <div class="sizedToGridArea firstRowFirstColumn" data-expected-height="2 0" data-expected-width="100">XXXXX XXXXXX</div>
80 </div> 81 </div>
81 <div class="grid min-content maxWidthAutoGrid" data-expected-height="20" dat a-expected-width="60"> 82 <div class="grid min-content maxWidthAutoGrid" data-expected-height="20" dat a-expected-width="60">
82 <div class="sizedToGridArea firstRowFirstColumn" data-expected-height="2 0" data-expected-width="60">XXXXX XXXXXX</div> 83 <div class="sizedToGridArea firstRowFirstColumn" data-expected-height="2 0" data-expected-width="60">XXXXX XXXXXX</div>
83 </div> 84 </div>
84 </div> 85 </div>
85 86
86 </body> 87 </body>
87 </html> 88 </html>
OLDNEW
« no previous file with comments | « third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-dynamic-updates-relayout.html ('k') | third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-element-repeat-get-set.html » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698