LayoutTests/fast/css-grid-layout/non-grid-columns-rows-get-set-multiple.html - Issue 23472008: [CSS Grid Layout] Support calc() breadth track size

Side by Side Diff: LayoutTests/fast/css-grid-layout/non-grid-columns-rows-get-set-multiple.html

Issue 23472008: [CSS Grid Layout] Support calc() breadth track size (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@103761-wk

Patch Set: Patch for landing Created 7 years, 1 month 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 | « LayoutTests/fast/css-grid-layout/non-grid-columns-rows-get-set-expected.txt ('k') | LayoutTests/fast/css-grid-layout/non-grid-columns-rows-get-set-multiple-expected.txt » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')

OLD	NEW
1 <!DOCTYPE html>	1 <!DOCTYPE html>

2 <html>	2 <html>

3 <head>	3 <head>

4 <link href="resources/grid.css" rel="stylesheet">	4 <link href="resources/grid.css" rel="stylesheet">

5 <style>	5 <style>

6 .gridWithFixed {	6 .gridWithFixed {

7 grid-definition-columns: 7px 11px;	7 grid-definition-columns: 7px 11px;

8 grid-definition-rows: 17px 2px;	8 grid-definition-rows: 17px 2px;

9 }	9 }

10	10

(...skipping 46 matching lines...) Expand 10 before \| Expand all \| Expand 10 after Loading...
57 font: 10px Ahem;	57 font: 10px Ahem;

58 }	58 }

59 .gridWithFractionFraction {	59 .gridWithFractionFraction {

60 grid-definition-columns: 1fr 2fr;	60 grid-definition-columns: 1fr 2fr;

61 grid-definition-rows: 3fr 4fr;	61 grid-definition-rows: 3fr 4fr;

62 }	62 }

63 .gridWithFractionMinMax {	63 .gridWithFractionMinMax {

64 grid-definition-columns: minmax(min-content, 45px) 2fr;	64 grid-definition-columns: minmax(min-content, 45px) 2fr;

65 grid-definition-rows: 3fr minmax(14px, max-content);	65 grid-definition-rows: 3fr minmax(14px, max-content);

66 }	66 }

	67 .gridWithCalcCalc {

	68 grid-definition-columns: calc(200px) calc(10em);

	69 grid-definition-rows: calc(15em) calc(75px);

	70 font: 10px Ahem;

	71 }

	72 .gridWithCalcAndFixed {

	73 grid-definition-columns: calc(50%) 8em;

	74 grid-definition-rows: 88px calc(25%);

	75 font: 10px Ahem;

	76 }

	77 .gridWithCalcAndMinMax {

	78 grid-definition-columns: calc(30px + 20%) minmax(min-content, 80px);

	79 grid-definition-rows: minmax(25%, max-content) calc(10% - 7px);

	80 }

	81 .gridWithCalcInsideMinMax {

	82 grid-definition-columns: minmax(calc(23px + 10%), 400px) 12em;

	83 grid-definition-rows: calc(150px) minmax(5%, calc(50% - 125px));

	84 font: 10px Ahem;

	85 }

67 </style>	86 </style>

68 <script src="../../resources/js-test.js"></script>	87 <script src="../../resources/js-test.js"></script>

69 </head>	88 </head>

70 <body>	89 <body>

71 <div class="gridWithFixed" id="gridWithFixedElement"></div>	90 <div class="gridWithFixed" id="gridWithFixedElement"></div>

72 <div class="gridWithPercent" id="gridWithPercentElement"></div>	91 <div class="gridWithPercent" id="gridWithPercentElement"></div>

73 <div class="gridWithAuto" id="gridWithAutoElement"></div>	92 <div class="gridWithAuto" id="gridWithAutoElement"></div>

74 <div class="gridWithEM" id="gridWithEMElement"></div>	93 <div class="gridWithEM" id="gridWithEMElement"></div>

75 <div class="gridWithNoneAndAuto" id="gridWithNoneAndAuto"></div>	94 <div class="gridWithNoneAndAuto" id="gridWithNoneAndAuto"></div>

76 <div class="gridWithNoneAndFixed" id="gridWithNoneAndFixed"></div>	95 <div class="gridWithNoneAndFixed" id="gridWithNoneAndFixed"></div>

77 <div class="gridWithThreeItems" id="gridWithThreeItems"></div>	96 <div class="gridWithThreeItems" id="gridWithThreeItems"></div>

78 <div class="gridWithPercentAndViewportPercent" id="gridWithPercentAndViewportPer cent"></div>	97 <div class="gridWithPercentAndViewportPercent" id="gridWithPercentAndViewportPer cent"></div>

79 <div class="gridWithFitContentAndFitAvailable" id="gridWithFitContentAndFitAvail able"></div>	98 <div class="gridWithFitContentAndFitAvailable" id="gridWithFitContentAndFitAvail able"></div>

80 <div class="gridWithMinMaxContent" id="gridWithMinMaxContent"></div>	99 <div class="gridWithMinMaxContent" id="gridWithMinMaxContent"></div>

81 <div class="gridWithMinMaxAndFixed" id="gridWithMinMaxAndFixed"></div>	100 <div class="gridWithMinMaxAndFixed" id="gridWithMinMaxAndFixed"></div>

82 <div class="gridWithMinMaxAndMinMaxContent" id="gridWithMinMaxAndMinMaxContent"> </div>	101 <div class="gridWithMinMaxAndMinMaxContent" id="gridWithMinMaxAndMinMaxContent"> </div>

83 <div class="gridWithFractionFraction" id="gridWithFractionFraction"></div>	102 <div class="gridWithFractionFraction" id="gridWithFractionFraction"></div>

84 <div class="gridWithFractionMinMax" id="gridWithFractionMinMax"></div>	103 <div class="gridWithFractionMinMax" id="gridWithFractionMinMax"></div>

	104 <div class="gridWithCalcCalc" id="gridWithCalcCalc"></div>

	105 <div class="gridWithCalcAndFixed" id="gridWithCalcAndFixed"></div>

	106 <div class="gridWithCalcAndMinMax" id="gridWithCalcAndMinMax"></div>

	107 <div class="gridWithCalcInsideMinMax" id="gridWithCalcInsideMinMax"></div>

85 <script src="resources/grid-definitions-parsing-utils.js"></script>	108 <script src="resources/grid-definitions-parsing-utils.js"></script>

86 <script src="resources/non-grid-columns-rows-get-set-multiple.js"></script>	109 <script src="resources/non-grid-columns-rows-get-set-multiple.js"></script>

87 </body>	110 </body>

88 </html>	111 </html>

OLD	NEW