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

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-container-change-named-grid-lines-recompute-child.html

Issue 1576993003: [css-grid] Fix placement for unknown named grid lines (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Fixing last review comments Created 4 years, 11 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 | third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-item-bad-named-area-auto-placement.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 <script src="../../resources/check-layout.js"></script> 4 <script src="../../resources/check-layout.js"></script>
5 <style> 5 <style>
6 .grid { 6 .grid {
7 grid-auto-flow: row dense; 7 grid-auto-flow: row dense;
8 } 8 }
9 #firstGridItem { 9 #firstGridItem {
10 grid-row: auto; 10 grid-row: auto;
(...skipping 34 matching lines...) Expand 10 before | Expand all | Expand 10 after
45 thirdGridItem.setAttribute("data-expected-height", thirdGridItemData.height) ; 45 thirdGridItem.setAttribute("data-expected-height", thirdGridItemData.height) ;
46 thirdGridItem.setAttribute("data-offset-x", thirdGridItemData.x); 46 thirdGridItem.setAttribute("data-offset-x", thirdGridItemData.x);
47 thirdGridItem.setAttribute("data-offset-y", thirdGridItemData.y); 47 thirdGridItem.setAttribute("data-offset-y", thirdGridItemData.y);
48 48
49 checkLayout(".grid"); 49 checkLayout(".grid");
50 } 50 }
51 51
52 function testChangingGridDefinitions() 52 function testChangingGridDefinitions()
53 { 53 {
54 testGridDefinitions('10px [row] 20px', '30px [column]', { 'width': '0', 'hei ght': '10', 'x': '30', 'y': '0' }, { 'width': '30', 'height': '20', 'x': '0', 'y ': '10' }, { 'width': '30', 'height': '10', 'x': '0', 'y': '0' }); 54 testGridDefinitions('10px [row] 20px', '30px [column]', { 'width': '0', 'hei ght': '10', 'x': '30', 'y': '0' }, { 'width': '30', 'height': '20', 'x': '0', 'y ': '10' }, { 'width': '30', 'height': '10', 'x': '0', 'y': '0' });
55 testGridDefinitions('10px [row] 20px', '30px', { 'width': '30', 'height': '1 0', 'x': '0', 'y': '0' }, { 'width': '30', 'height': '20', 'x': '0', 'y': '10' } , { 'width': '30', 'height': '0', 'x': '0', 'y': '30' }); 55 testGridDefinitions('10px [row] 20px', '30px', { 'width': '0', 'height': '10 ', 'x': '30', 'y': '0' }, { 'width': '30', 'height': '20', 'x': '0', 'y': '10' } , { 'width': '30', 'height': '10', 'x': '0', 'y': '0' });
56 testGridDefinitions('10px 20px [row]', '30px', { 'width': '30', 'height': '1 0', 'x': '0', 'y': '0' }, { 'width': '30', 'height': '0', 'x': '0', 'y': '30' }, { 'width': '30', 'height': '20', 'x': '0', 'y': '10' }); 56 testGridDefinitions('10px 20px [row]', '30px', { 'width': '0', 'height': '10 ', 'x': '30', 'y': '0' }, { 'width': '30', 'height': '0', 'x': '0', 'y': '30' }, { 'width': '30', 'height': '10', 'x': '0', 'y': '0' });
57 testGridDefinitions('10px 20px [row]', '30px [column]', { 'width': '0', 'hei ght': '10', 'x': '30', 'y': '0' }, { 'width': '30', 'height': '0', 'x': '0', 'y' : '30' }, { 'width': '30', 'height': '10', 'x': '0', 'y': '0' }); 57 testGridDefinitions('10px 20px [row]', '30px [column]', { 'width': '0', 'hei ght': '10', 'x': '30', 'y': '0' }, { 'width': '30', 'height': '0', 'x': '0', 'y' : '30' }, { 'width': '30', 'height': '10', 'x': '0', 'y': '0' });
58 } 58 }
59 59
60 window.addEventListener("load", testChangingGridDefinitions, false); 60 window.addEventListener("load", testChangingGridDefinitions, false);
61 </script> 61 </script>
62 <body> 62 <body>
63 <div>This test checks that updating the named grid lines definitions in grid-tem plate-{rows|columns} recomputes the positions of automatically placed grid items .</div> 63 <div>This test checks that updating the named grid lines definitions in grid-tem plate-{rows|columns} recomputes the positions of automatically placed grid items .</div>
64 64
65 <div style="position: relative"> 65 <div style="position: relative">
66 <div class="grid"> 66 <div class="grid">
67 <div class="sizedToGridArea" id="firstGridItem"></div> 67 <div class="sizedToGridArea" id="firstGridItem"></div>
68 <div class="sizedToGridArea" id="secondGridItem"></div> 68 <div class="sizedToGridArea" id="secondGridItem"></div>
69 <div class="sizedToGridArea" id="thirdGridItem"></div> 69 <div class="sizedToGridArea" id="thirdGridItem"></div>
70 </div> 70 </div>
71 </div> 71 </div>
72 72
73 </body> 73 </body>
74 </html> 74 </html>
OLDNEW
« no previous file with comments | « no previous file | third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-item-bad-named-area-auto-placement.html » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698