third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-gutters-get-set.html - Issue 1309513008: [css-grid] Implement grid gutters

Side by Side Diff: third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-gutters-get-set.html

Issue 1309513008: [css-grid] Implement grid gutters (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master

Patch Set: Rebased patch for landing Created 5 years, 2 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-gutters-and-tracks-expected.txt ('k') | third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-gutters-get-set-expected.txt » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')

OLD	NEW
(Empty)
	1 <!DOCTYPE html>

	2 <html>

	3 <head>

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

	5 <style>

	6 .gridGap { grid-gap: 25px; }

	7 .gridColumnGap { grid-column-gap: 2vw; }

	8 .gridRowGap { grid-row-gap: 2em; }

	9 .gridRowColumnGaps {

	10 grid-row-gap: 12px;

	11 grid-column-gap: 1rem;

	12 }

	13 .gridRowColumnInheritGaps {

	14 grid-row-gap: inherit;

	15 grid-column-gap: inherit;

	16 }

	17 .gridRowColumnInitialGaps {

	18 grid-row-gap: initial;

	19 grid-column-gap: initial;

	20 }

	21 .gridCalcGaps {

	22 grid-row-gap: calc(10px + 3px);

	23 grid-column-gap: calc(2px + 1vw);

	24 }

	25 .gridInvalidRowGap { grid-row-gap: 10%; }

	26 .gridInvalidColumnGap { grid-column-gap: -webkit-max-content; }

	27 .gridInvalidMultipleRowColumnGaps {

	28 grid-row-gap: 10px 1px;

	29 grid-column-gap: 0px 0px 0px;

	30 }

	31 .gridInvalidLengthRowColumnGaps {

	32 grid-row-gap: 2dpi;

	33 grid-column-gap: 3rad;

	34 }

	35 .gridInvalidGridGap { grid-gap: 20px 20px 10px; }

	36 .gridInvalidNoneGap { grid-gap: none; }

	37 .gridInvalidImplicitGridGap { grid-gap: -webkit-fit-content; }

	38

	39 </style>

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

	41 </head>

	42 <body>

	43

	44 <div class="grid" id="defaultGrid"></div>

	45 <div class="grid gridGap" id="gridGap"></div>

	46 <div class="grid gridColumnGap" id="gridColumnGap"></div>

	47 <div class="grid gridRowGap" id="gridRowGap"></div>

	48 <div class="grid gridCalcGaps" id="gridCalcGaps"></div>

	49 <div class="grid gridRowColumnGaps" id="gridRowColumnGaps"></div>

	50 <div class="grid gridGap">

	51 <div class="grid gridRowColumnInheritGaps" id="gridRowColumnInheritGaps"></d iv>

	52 </div>

	53 <div class="grid gridGap">

	54 <div class="grid gridRowColumnInitialGaps" id="gridRowColumnInitialGaps"></d iv>

	55 </div>

	56 <div class="grid gridInvalidRowGap" id="gridInvalidRowGap"></div>

	57 <div class="grid gridInvalidColumnGap" id="gridInvalidColumnGap"></div>

	58 <div class="grid gridInvalidMultipleRowColumnGaps" id="gridInvalidMultipleRowCol umnGaps"></div>

	59 <div class="grid gridInvalidGridGap" id="gridInvalidGridGap"></div>

	60 <div class="grid gridInvalidNoneGap" id="gridInvalidNoneGap"></div>

	61 <div class="grid gridInvalidImplicitGridGap" id="gridInvalidImplicitGridGap"></d iv>

	62 <div class="grid gridInvalidLengthRowColumnGaps" id="gridInvalidLengthRowColumnG aps"></div>

	63

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

	65 <script>

	66

	67 description('Test that setting and getting grid-column-gap and grid-row-gap work s as expected');

	68

	69 debug("Test getting grid-column-gap and grid-row-gap set through CSS");

	70

	71 testGridGapDefinitionsValues("defaultGrid", "0px", "0px");

	72 testGridGapDefinitionsValues("gridGap", "25px", "25px");

	73 testGridGapDefinitionsValues("gridColumnGap", "0px", "16px");

	74 testGridGapDefinitionsValues("gridRowGap", "32px", "0px");

	75 testGridGapDefinitionsValues("gridCalcGaps", "13px", "10px");

	76 testGridGapDefinitionsValues("gridRowColumnGaps", "12px", "16px");

	77 testGridGapDefinitionsValues("gridRowColumnGaps", "12px", "16px");

	78 testGridGapDefinitionsValues("gridRowColumnInheritGaps", "25px", "25px");

	79 testGridGapDefinitionsValues("gridRowColumnInitialGaps", "0px", "0px");

	80

	81 debug("");

	82 debug("Test getting wrong values for grid-column-gap and grid-row-gap set throug h CSS");

	83 testGridGapDefinitionsValues("gridInvalidRowGap", "0px", "0px");

	84 testGridGapDefinitionsValues("gridInvalidColumnGap", "0px", "0px");

	85 testGridGapDefinitionsValues("gridInvalidMultipleRowColumnGaps", "0px", "0px");

	86 testGridGapDefinitionsValues("gridInvalidGridGap", "0px", "0px");

	87 testGridGapDefinitionsValues("gridInvalidNoneGap", "0px", "0px");

	88 testGridGapDefinitionsValues("gridInvalidImplicitGridGap", "0px", "0px");

	89 testGridGapDefinitionsValues("gridInvalidLengthRowColumnGaps", "0px", "0px");

	90

	91 </script>

	92 </body>

	93 </html>

OLD	NEW