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

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: LayoutTests/fast/css-grid-layout/grid-items-should-not-be-stretched-when-height-or-width-or-margin-change.html

Issue 1335213004: [CSS Grid Layout] Content sized tracks must clear the override height (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master
Patch Set: 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-items-should-not-be-stretched-when-height-or-width-or-margin-change-expected.txt » ('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 <link href="resources/grid.css" rel="stylesheet"> 2 <link href="resources/grid.css" rel="stylesheet">
3 <script src="../../resources/check-layout.js"></script> 3 <script src="../../resources/check-layout.js"></script>
4 <style> 4 <style>
5 .grid { 5 .grid {
6 grid-template: 200px 200px / 200px 200px;
7 width: -webkit-fit-content; 6 width: -webkit-fit-content;
8 position: relative; 7 position: relative;
9 } 8 }
9 .content {
10 width: 200px;
11 height: 200px;
12 }
10 #fromFixedWidth { width: 150px; } 13 #fromFixedWidth { width: 150px; }
11 #fromFixedHeight { height: 100px; } 14 #fromFixedHeight { height: 100px; }
12 #fromMarginAuto { margin: auto; } 15 #fromMarginAuto { margin: auto; }
13 </style> 16 </style>
14 <p>The grids below had initially 'stretched' items, but we have changed 'height' , 'width' and 'margin' to values which don't allow stretch. This test verifies t hat the layout algorithm properly detects such changes and clear the override he ight and width accordingly.</p> 17 <p>The grids below had initially 'stretched' items, but we have changed 'height' , 'width' and 'margin' to values which don't allow stretch. This test verifies t hat the layout algorithm properly detects such changes and clear the override he ight and width accordingly.</p>
15 <div class="grid"> 18 <div class="grid" style="grid-template: 200px 200px / 200px 200px;">
16 <div id="toFixedHeight" class="firstRowFirstColumn" data-expected-width="200 " data-expected-height="100"></div> 19 <div id="toFixedHeight" class="firstRowFirstColumn" data-expected-width="200 " data-expected-height="100"></div>
17 <div class="firstRowSecondColumn" data-expected-width="200" data-expected-he ight="200"></div> 20 <div class="firstRowSecondColumn" data-expected-width="200" data-expected-he ight="200"></div>
18 <div class="secondRowFirstColumn" data-expected-width="200" data-expected-he ight="200"></div> 21 <div class="secondRowFirstColumn" data-expected-width="200" data-expected-he ight="200"></div>
19 <div id="fromFixedHeight" class="secondRowSecondColumn" data-expected-width= "200" data-expected-height="200"></div> 22 <div id="fromFixedHeight" class="secondRowSecondColumn" data-expected-width= "200" data-expected-height="200"></div>
20 </div> 23 </div>
21 <div class="grid"> 24 <div class="grid" style="grid-template: 200px 200px / 200px 200px;">
22 <div id="toFixedWidth" class="firstRowFirstColumn" data-expected-width="150" data-expected-height="200"></div> 25 <div id="toFixedWidth" class="firstRowFirstColumn" data-expected-width="150" data-expected-height="200"></div>
23 <div class="firstRowSecondColumn" data-expected-width="200" data-expected-he ight="200"></div> 26 <div class="firstRowSecondColumn" data-expected-width="200" data-expected-he ight="200"></div>
24 <div class="secondRowFirstColumn" data-expected-width="200" data-expected-he ight="200"></div> 27 <div class="secondRowFirstColumn" data-expected-width="200" data-expected-he ight="200"></div>
25 <div id="fromFixedWidth" class="secondRowSecondColumn" data-expected-width=" 200" data-expected-height="200"></div> 28 <div id="fromFixedWidth" class="secondRowSecondColumn" data-expected-width=" 200" data-expected-height="200"></div>
26 </div> 29 </div>
27 <div class="grid"> 30 <div class="grid" style="grid-template: 200px 200px / 200px 200px;">
28 <div id="toMarginAuto" class="firstRowFirstColumn" data-expected-width="150" data-expected-height="100"> 31 <div id="toMarginAuto" class="firstRowFirstColumn" data-expected-width="150" data-expected-height="100">
29 <div style="width: 150px; height: 100px"></div> 32 <div style="width: 150px; height: 100px"></div>
30 </div> 33 </div>
31 <div class="firstRowSecondColumn" data-expected-width="200" data-expected-he ight="200"></div> 34 <div class="firstRowSecondColumn" data-expected-width="200" data-expected-he ight="200"></div>
32 <div class="secondRowFirstColumn" data-expected-width="200" data-expected-he ight="200"></div> 35 <div class="secondRowFirstColumn" data-expected-width="200" data-expected-he ight="200"></div>
33 <div id="fromMarginAuto" class="secondRowSecondColumn" data-expected-width=" 200" data-expected-height="200"> 36 <div id="fromMarginAuto" class="secondRowSecondColumn" data-expected-width=" 200" data-expected-height="200">
34 <div style="width: 150px; height: 100px"></div> 37 <div style="width: 150px; height: 100px"></div>
35 </div> 38 </div>
36 </div> 39 </div>
40 <div class="grid">
41 <div id="contentSized-toFixedHeight" class="firstRowFirstColumn" data-expect ed-width="200" data-expected-height="100"></div>
42 <div class="firstRowSecondColumn" data-expected-width="200" data-expected-he ight="200"><div class="content"></div></div>
43 <div class="secondRowFirstColumn" data-expected-width="200" data-expected-he ight="200"><div class="content"></div></div>
44 <div id="contentSized-fromFixedHeight" class="secondRowSecondColumn" data-ex pected-width="200" data-expected-height="200"></div>
45 </div>
46 <div class="grid">
47 <div id="contentSized-toFixedWidth" class="firstRowFirstColumn" data-expecte d-width="150" data-expected-height="200"></div>
48 <div class="firstRowSecondColumn" data-expected-width="200" data-expected-he ight="200"><div class="content"></div></div>
49 <div class="secondRowFirstColumn" data-expected-width="200" data-expected-he ight="200"><div class="content"></div></div>
50 <div id="contentSized-fromFixedWidth" class="secondRowSecondColumn" data-exp ected-width="200" data-expected-height="200"></div>
51 </div>
52 <div class="grid">
53 <div id="contentSized-toMarginAuto" class="firstRowFirstColumn" data-expecte d-width="150" data-expected-height="100">
54 <div style="width: 150px; height: 100px"></div>
55 </div>
56 <div class="firstRowSecondColumn" data-expected-width="200" data-expected-he ight="200"><div class="content"></div></div>
57 <div class="secondRowFirstColumn" data-expected-width="200" data-expected-he ight="200"><div class="content"></div></div>
58 <div id="contentSized-fromMarginAuto" class="secondRowSecondColumn" data-exp ected-width="200" data-expected-height="200">
59 <div style="width: 150px; height: 100px"></div>
60 </div>
61 </div>
37 <script> 62 <script>
38 document.body.offsetLeft; 63 document.body.offsetLeft;
39 document.getElementById("fromFixedHeight").style.height = "auto"; 64 document.getElementById("fromFixedHeight").style.height = "auto";
40 document.getElementById("toFixedHeight").style.height = "100px"; 65 document.getElementById("toFixedHeight").style.height = "100px";
41 document.getElementById("fromFixedWidth").style.width = "auto"; 66 document.getElementById("fromFixedWidth").style.width = "auto";
42 document.getElementById("toFixedWidth").style.width = "150px"; 67 document.getElementById("toFixedWidth").style.width = "150px";
43 document.getElementById("fromMarginAuto").style.margin = "0"; 68 document.getElementById("fromMarginAuto").style.margin = "0";
44 document.getElementById("toMarginAuto").style.margin = "auto"; 69 document.getElementById("toMarginAuto").style.margin = "auto";
70 document.getElementById("contentSized-fromFixedHeight").style.height = "auto";
71 document.getElementById("contentSized-toFixedHeight").style.height = "100px";
72 document.getElementById("contentSized-fromFixedWidth").style.width = "auto";
73 document.getElementById("contentSized-toFixedWidth").style.width = "150px";
74 document.getElementById("contentSized-fromMarginAuto").style.margin = "0";
75 document.getElementById("contentSized-toMarginAuto").style.margin = "auto";
45 checkLayout(".grid"); 76 checkLayout(".grid");
46 </script> 77 </script>
OLDNEW
« no previous file with comments | « no previous file | LayoutTests/fast/css-grid-layout/grid-items-should-not-be-stretched-when-height-or-width-or-margin-change-expected.txt » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698