third_party/WebKit/LayoutTests/fast/css-grid-layout/calc-resolution-grid-item.html - Issue 1488493003: [css-grid] refactoring of layout tests

Side by Side Diff: third_party/WebKit/LayoutTests/fast/css-grid-layout/calc-resolution-grid-item.html

Issue 1488493003: [css-grid] refactoring of layout tests (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master

Patch Set: Patch rebased and refactoring of alignment css rules. 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

OLD	NEW
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 <style>	4 <style>

5 .grid {	5 .grid {

6 grid-template-columns: 100px 300px;	6 grid-template-columns: 100px 300px;

7 grid-template-rows: 50px 150px;	7 grid-template-rows: 50px 150px;

8 height: 200px;	8 height: 200px;

9 width: 400px;	9 width: 400px;

10 }	10 }

11	11

12 .calcWidth {	12 .calcWidth {

13 width: -webkit-calc(80% + 20%);	13 width: -webkit-calc(80% + 20%);

	14 width: calc(80% + 20%);

14 height: 15px;	15 height: 15px;

15 }	16 }

16	17

17 .calcHeight {	18 .calcHeight {

18 width: 15px;	19 width: 15px;

19 height: -webkit-calc(80% + 20px);	20 height: -webkit-calc(80% + 20px);

	21 height: calc(80% + 20px);

20 }	22 }

21	23

22 .calcHeightAndWidth {	24 .calcHeightAndWidth {

23 width: -webkit-calc(80% + 20px);	25 width: -webkit-calc(80% + 20px);

	26 width: calc(80% + 20px);

24 height: -webkit-calc(70% + 30%);	27 height: -webkit-calc(70% + 30%);

	28 height: calc(70% + 30%);

25 }	29 }

26 </style>	30 </style>

27 <script src="../../resources/check-layout.js"></script>	31 <script src="../../resources/check-layout.js"></script>

28 <body onload="checkLayout('.grid')">	32 <body onload="checkLayout('.grid')">

29	33

30 <p>Test that resolving calc lengths on grid items works properly on a fixed grid with different writing modes.</p>	34 <p>Test that resolving calc lengths on grid items works properly on a fixed grid with different writing modes.</p>

31	35

32 <div class="grid">	36 <div class="grid">

33 <div class="firstRowFirstColumn calcWidth" data-expected-width="100" data-ex pected-height="15"></div>	37 <div class="firstRowFirstColumn calcWidth" data-expected-width="100" data-ex pected-height="15"></div>

34 <div class="firstRowSecondColumn calcHeight" data-expected-width="15" data-e xpected-height="60"></div>	38 <div class="firstRowSecondColumn calcHeight" data-expected-width="15" data-e xpected-height="60"></div>

(...skipping 16 matching lines...) Expand all Loading...
51 </div>	55 </div>

52	56

53 <div class="grid">	57 <div class="grid">

54 <div class="firstRowFirstColumn calcWidth verticalRL" data-expected-width="1 00" data-expected-height="15"></div>	58 <div class="firstRowFirstColumn calcWidth verticalRL" data-expected-width="1 00" data-expected-height="15"></div>

55 <div class="firstRowSecondColumn calcHeight" data-expected-width="15" data-e xpected-height="60"></div>	59 <div class="firstRowSecondColumn calcHeight" data-expected-width="15" data-e xpected-height="60"></div>

56 <div class="secondRowFirstColumn calcHeightAndWidth verticalRL" data-expecte d-width="100" data-expected-height="150"></div>	60 <div class="secondRowFirstColumn calcHeightAndWidth verticalRL" data-expecte d-width="100" data-expected-height="150"></div>

57 <div class="secondRowSecondColumn calcHeightAndWidth" data-expected-width="2 60" data-expected-height="150"></div>	61 <div class="secondRowSecondColumn calcHeightAndWidth" data-expected-width="2 60" data-expected-height="150"></div>

58 </div>	62 </div>

59 </body>	63 </body>

60 </html>	64 </html>

OLD	NEW

« no previous file with comments | « no previous file | third_party/WebKit/LayoutTests/fast/css-grid-layout/flex-and-intrinsic-sizes.html » ('j') | no next file with comments »