Update HSL/HSLA parsing to match CSS Color 4
authorcommit-queue@webkit.org <commit-queue@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Fri, 20 Apr 2018 22:28:47 +0000 (22:28 +0000)
committercommit-queue@webkit.org <commit-queue@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Fri, 20 Apr 2018 22:28:47 +0000 (22:28 +0000)
https://bugs.webkit.org/show_bug.cgi?id=180528
<rdar://problem/35926675>

LayoutTests/imported/w3c:

Patch by Chris Nardi <cnardi@chromium.org> on 2018-04-20
Reviewed by Simon Fraser.

CSS Color 4 had many changes to the HSL/HSLA functions, including allowing angles to be
specified as the hue, adding a comma optional syntax, making the two functions synonyms
so each function can take an alpha value, and allowing percent alpha values. This change
updates our behavior to match that, and updates the HSL to RGB algorithm.

This change also updates the import of WPT css-color to test the changes.

* canvas/2d.fillStyle.parse.invalid.hsl-5-expected.txt:
* web-platform-tests/css/css-color/OWNERS: Added.
* web-platform-tests/css/css-color/border-bottom-color-expected.xht: Added.
* web-platform-tests/css/css-color/border-bottom-color.xht: Added.
* web-platform-tests/css/css-color/border-left-color-expected.xht: Added.
* web-platform-tests/css/css-color/border-left-color.xht: Added.
* web-platform-tests/css/css-color/border-right-color-expected.xht: Added.
* web-platform-tests/css/css-color/border-right-color.xht: Added.
* web-platform-tests/css/css-color/border-top-color-expected.xht: Added.
* web-platform-tests/css/css-color/border-top-color.xht: Added.
* web-platform-tests/css/css-color/color-001-expected.html: Added.
* web-platform-tests/css/css-color/color-001.html: Added.
* web-platform-tests/css/css-color/color-002-expected.html: Added.
* web-platform-tests/css/css-color/color-002.html: Added.
* web-platform-tests/css/css-color/color-003-expected.html: Added.
* web-platform-tests/css/css-color/color-003.html: Added.
* web-platform-tests/css/css-color/currentcolor-001-expected.html: Added.
* web-platform-tests/css/css-color/currentcolor-001.html: Added.
* web-platform-tests/css/css-color/currentcolor-002-expected.html: Added.
* web-platform-tests/css/css-color/currentcolor-002.html: Added.
* web-platform-tests/css/css-color/hex-001-expected.html: Added.
* web-platform-tests/css/css-color/hex-001.html: Added.
* web-platform-tests/css/css-color/hex-002-expected.html: Added.
* web-platform-tests/css/css-color/hex-002.html: Added.
* web-platform-tests/css/css-color/hex-003-expected.html: Added.
* web-platform-tests/css/css-color/hex-003.html: Added.
* web-platform-tests/css/css-color/hex-004-expected.html: Added.
* web-platform-tests/css/css-color/hex-004.html: Added.
* web-platform-tests/css/css-color/hsl-001-expected.html: Added.
* web-platform-tests/css/css-color/hsl-001.html: Added.
* web-platform-tests/css/css-color/hsl-002-expected.html: Added.
* web-platform-tests/css/css-color/hsl-002.html: Added.
* web-platform-tests/css/css-color/hsl-003-expected.html: Added.
* web-platform-tests/css/css-color/hsl-003.html: Added.
* web-platform-tests/css/css-color/hsl-004-expected.html: Added.
* web-platform-tests/css/css-color/hsl-004.html: Added.
* web-platform-tests/css/css-color/hsl-005-expected.html: Added.
* web-platform-tests/css/css-color/hsl-005.html: Added.
* web-platform-tests/css/css-color/hsl-006-expected.html: Added.
* web-platform-tests/css/css-color/hsl-006.html: Added.
* web-platform-tests/css/css-color/hsl-007-expected.html: Added.
* web-platform-tests/css/css-color/hsl-007.html: Added.
* web-platform-tests/css/css-color/hsl-008-expected.html: Added.
* web-platform-tests/css/css-color/hsl-008.html: Added.
* web-platform-tests/css/css-color/hsla-001-expected.html: Added.
* web-platform-tests/css/css-color/hsla-001.html: Added.
* web-platform-tests/css/css-color/hsla-002-expected.html: Added.
* web-platform-tests/css/css-color/hsla-002.html: Added.
* web-platform-tests/css/css-color/hsla-003-expected.html: Added.
* web-platform-tests/css/css-color/hsla-003.html: Added.
* web-platform-tests/css/css-color/hsla-004-expected.html: Added.
* web-platform-tests/css/css-color/hsla-004.html: Added.
* web-platform-tests/css/css-color/hsla-005-expected.html: Added.
* web-platform-tests/css/css-color/hsla-005.html: Added.
* web-platform-tests/css/css-color/hsla-006-expected.html: Added.
* web-platform-tests/css/css-color/hsla-006.html: Added.
* web-platform-tests/css/css-color/hsla-007-expected.html: Added.
* web-platform-tests/css/css-color/hsla-007.html: Added.
* web-platform-tests/css/css-color/hsla-008-expected.html: Added.
* web-platform-tests/css/css-color/hsla-008.html: Added.
* web-platform-tests/css/css-color/htaccess: Added.
* web-platform-tests/css/css-color/lab-001-expected.html: Added.
* web-platform-tests/css/css-color/lab-001.html: Added.
* web-platform-tests/css/css-color/lab-002-expected.html: Added.
* web-platform-tests/css/css-color/lab-002.html: Added.
* web-platform-tests/css/css-color/lab-003-expected.html: Added.
* web-platform-tests/css/css-color/lab-003.html: Added.
* web-platform-tests/css/css-color/lab-004-expected.html: Added.
* web-platform-tests/css/css-color/lab-004.html: Added.
* web-platform-tests/css/css-color/lab-005-expected.html: Added.
* web-platform-tests/css/css-color/lab-005.html: Added.
* web-platform-tests/css/css-color/lab-006-expected.html: Added.
* web-platform-tests/css/css-color/lab-006.html: Added.
* web-platform-tests/css/css-color/lab-007-expected.html: Added.
* web-platform-tests/css/css-color/lab-007.html: Added.
* web-platform-tests/css/css-color/lch-001-expected.html: Added.
* web-platform-tests/css/css-color/lch-001.html: Added.
* web-platform-tests/css/css-color/lch-002-expected.html: Added.
* web-platform-tests/css/css-color/lch-002.html: Added.
* web-platform-tests/css/css-color/lch-003-expected.html: Added.
* web-platform-tests/css/css-color/lch-003.html: Added.
* web-platform-tests/css/css-color/lch-004-expected.html: Added.
* web-platform-tests/css/css-color/lch-004.html: Added.
* web-platform-tests/css/css-color/lch-005-expected.html: Added.
* web-platform-tests/css/css-color/lch-005.html: Added.
* web-platform-tests/css/css-color/lch-006-expected.html: Added.
* web-platform-tests/css/css-color/lch-006.html: Added.
* web-platform-tests/css/css-color/lch-007-expected.html: Added.
* web-platform-tests/css/css-color/lch-007.html: Added.
* web-platform-tests/css/css-color/named-001-expected.html: Added.
* web-platform-tests/css/css-color/named-001.html: Added.
* web-platform-tests/css/css-color/rgb-001-expected.html: Added.
* web-platform-tests/css/css-color/rgb-001.html: Added.
* web-platform-tests/css/css-color/rgb-002-expected.html: Added.
* web-platform-tests/css/css-color/rgb-002.html: Added.
* web-platform-tests/css/css-color/rgb-003-expected.html: Added.
* web-platform-tests/css/css-color/rgb-003.html: Added.
* web-platform-tests/css/css-color/rgb-004-expected.html: Added.
* web-platform-tests/css/css-color/rgb-004.html: Added.
* web-platform-tests/css/css-color/rgb-005-expected.html: Added.
* web-platform-tests/css/css-color/rgb-005.html: Added.
* web-platform-tests/css/css-color/rgb-006-expected.html: Added.
* web-platform-tests/css/css-color/rgb-006.html: Added.
* web-platform-tests/css/css-color/rgb-007-expected.html: Added.
* web-platform-tests/css/css-color/rgb-007.html: Added.
* web-platform-tests/css/css-color/rgb-008-expected.html: Added.
* web-platform-tests/css/css-color/rgb-008.html: Added.
* web-platform-tests/css/css-color/rgba-001-expected.html: Added.
* web-platform-tests/css/css-color/rgba-001.html: Added.
* web-platform-tests/css/css-color/rgba-002-expected.html: Added.
* web-platform-tests/css/css-color/rgba-002.html: Added.
* web-platform-tests/css/css-color/rgba-003-expected.html: Added.
* web-platform-tests/css/css-color/rgba-003.html: Added.
* web-platform-tests/css/css-color/rgba-004-expected.html: Added.
* web-platform-tests/css/css-color/rgba-004.html: Added.
* web-platform-tests/css/css-color/rgba-005-expected.html: Added.
* web-platform-tests/css/css-color/rgba-005.html: Added.
* web-platform-tests/css/css-color/rgba-006-expected.html: Added.
* web-platform-tests/css/css-color/rgba-006.html: Added.
* web-platform-tests/css/css-color/rgba-007-expected.html: Added.
* web-platform-tests/css/css-color/rgba-007.html: Added.
* web-platform-tests/css/css-color/rgba-008-expected.html: Added.
* web-platform-tests/css/css-color/rgba-008.html: Added.
* web-platform-tests/css/css-color/t31-color-currentColor-b.xht:
* web-platform-tests/css/css-color/t31-color-text-a-expected.xht: Added.
* web-platform-tests/css/css-color/t31-color-text-a.xht: Added.
* web-platform-tests/css/css-color/t32-opacity-basic-0.0-a-expected.html: Added.
* web-platform-tests/css/css-color/t32-opacity-basic-0.0-a.xht: Added.
* web-platform-tests/css/css-color/t32-opacity-basic-1.0-a-expected.html: Added.
* web-platform-tests/css/css-color/t32-opacity-basic-1.0-a.xht: Added.
* web-platform-tests/css/css-color/t32-opacity-clamping-0.0-b-expected.html: Added.
* web-platform-tests/css/css-color/t32-opacity-clamping-0.0-b.xht: Added.
* web-platform-tests/css/css-color/t32-opacity-clamping-1.0-b-expected.html: Added.
* web-platform-tests/css/css-color/t32-opacity-clamping-1.0-b.xht: Added.
* web-platform-tests/css/css-color/t32-opacity-offscreen-b-expected.html: Added.
* web-platform-tests/css/css-color/t32-opacity-offscreen-b.xht: Added.
* web-platform-tests/css/css-color/t32-opacity-offscreen-multiple-boxes-1-c.xht:
* web-platform-tests/css/css-color/t32-opacity-offscreen-multiple-boxes-2-c.xht:
* web-platform-tests/css/css-color/t32-opacity-offscreen-with-alpha-c-expected.html: Added.
* web-platform-tests/css/css-color/t32-opacity-offscreen-with-alpha-c.xht: Added.
* web-platform-tests/css/css-color/t41-html4-keywords-a-expected.html: Added.
* web-platform-tests/css/css-color/t41-html4-keywords-a.xht: Added.
* web-platform-tests/css/css-color/t421-rgb-clip-outside-gamut-b-expected.html: Added.
* web-platform-tests/css/css-color/t421-rgb-clip-outside-gamut-b.xht: Added.
* web-platform-tests/css/css-color/t421-rgb-func-int-a.xht:
* web-platform-tests/css/css-color/t421-rgb-func-no-mixed-f.xht:
* web-platform-tests/css/css-color/t421-rgb-func-pct-a.xht:
* web-platform-tests/css/css-color/t421-rgb-func-whitespace-b.xht:
* web-platform-tests/css/css-color/t421-rgb-hex-parsing-f.xht:
* web-platform-tests/css/css-color/t421-rgb-hex3-a.xht:
* web-platform-tests/css/css-color/t421-rgb-hex6-a.xht:
* web-platform-tests/css/css-color/t421-rgb-values-meaning-b-expected.html: Added.
* web-platform-tests/css/css-color/t421-rgb-values-meaning-b.xht: Added.
* web-platform-tests/css/css-color/t422-rgba-a0.0-a-expected.html: Added.
* web-platform-tests/css/css-color/t422-rgba-a0.0-a.xht: Added.
* web-platform-tests/css/css-color/t422-rgba-a1.0-a.xht:
* web-platform-tests/css/css-color/t422-rgba-clamping-a0.0-b.xht:
* web-platform-tests/css/css-color/t422-rgba-clamping-a1.0-b.xht:
* web-platform-tests/css/css-color/t422-rgba-clip-outside-device-gamut-b.xht:
* web-platform-tests/css/css-color/t422-rgba-func-int-a.xht:
* web-platform-tests/css/css-color/t422-rgba-func-no-mixed-f.xht:
* web-platform-tests/css/css-color/t422-rgba-func-pct-a.xht:
* web-platform-tests/css/css-color/t422-rgba-func-whitespace-b.xht:
* web-platform-tests/css/css-color/t422-rgba-onscreen-b.xht:
* web-platform-tests/css/css-color/t422-rgba-onscreen-multiple-boxes-c.xht:
* web-platform-tests/css/css-color/t422-rgba-values-meaning-b-expected.html: Added.
* web-platform-tests/css/css-color/t422-rgba-values-meaning-b.xht: Added.
* web-platform-tests/css/css-color/t423-transparent-1-a.xht:
* web-platform-tests/css/css-color/t423-transparent-2-a.xht:
* web-platform-tests/css/css-color/t424-hsl-basic-a.xht:
* web-platform-tests/css/css-color/t424-hsl-clip-outside-gamut-b.xht:
* web-platform-tests/css/css-color/t424-hsl-h-rotating-b-expected.html: Added.
* web-platform-tests/css/css-color/t424-hsl-h-rotating-b.xht: Added.
* web-platform-tests/css/css-color/t424-hsl-parsing-f.xht:
* web-platform-tests/css/css-color/t424-hsl-values-b-1.html:
* web-platform-tests/css/css-color/t424-hsl-values-b-10.html:
* web-platform-tests/css/css-color/t424-hsl-values-b-11.html:
* web-platform-tests/css/css-color/t424-hsl-values-b-12.html:
* web-platform-tests/css/css-color/t424-hsl-values-b-13.html:
* web-platform-tests/css/css-color/t424-hsl-values-b-14.html:
* web-platform-tests/css/css-color/t424-hsl-values-b-15.html:
* web-platform-tests/css/css-color/t424-hsl-values-b-2.html:
* web-platform-tests/css/css-color/t424-hsl-values-b-3.html:
* web-platform-tests/css/css-color/t424-hsl-values-b-4.html:
* web-platform-tests/css/css-color/t424-hsl-values-b-5.html:
* web-platform-tests/css/css-color/t424-hsl-values-b-6.html:
* web-platform-tests/css/css-color/t424-hsl-values-b-7.html:
* web-platform-tests/css/css-color/t424-hsl-values-b-8.html:
* web-platform-tests/css/css-color/t424-hsl-values-b-9.html:
* web-platform-tests/css/css-color/t425-hsla-clip-outside-device-gamut-b.xht:
* web-platform-tests/css/css-color/t425-hsla-h-rotating-b-expected.html: Added.
* web-platform-tests/css/css-color/t425-hsla-h-rotating-b.xht: Added.
* web-platform-tests/css/css-color/t425-hsla-onscreen-b-expected.html: Added.
* web-platform-tests/css/css-color/t425-hsla-onscreen-b.xht: Added.
* web-platform-tests/css/css-color/t425-hsla-onscreen-multiple-boxes-c.xht:
* web-platform-tests/css/css-color/t425-hsla-parsing-f.xht:
* web-platform-tests/css/css-color/t425-hsla-values-b.xht:
* web-platform-tests/css/css-color/t43-svg-keywords-a-expected.html: Added.
* web-platform-tests/css/css-color/t43-svg-keywords-a.xht: Added.
* web-platform-tests/css/css-color/t44-currentcolor-background-b.xht:
* web-platform-tests/css/css-color/t44-currentcolor-border-b-expected.html:
* web-platform-tests/css/css-color/t44-currentcolor-border-b.xht:
* web-platform-tests/css/css-color/t44-currentcolor-inherited-c-expected.xht: Added.
* web-platform-tests/css/css-color/t44-currentcolor-inherited-c.xht: Added.
* web-platform-tests/css/css-color/w3c-import.log: Added.

Source/WebCore:

CSS Color 4 specifies a comma optional syntax for HSL/HSLA, as well as allowing angle values for the
hue and percent alpha values. Update our parsing to match this.

Patch by Chris Nardi <cnardi@chromium.org> on 2018-04-20
Reviewed by Simon Fraser.

This change also updates the import of WPT css-color to test the changes.

Tests: LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl{a}-{001-008}.html

* css/parser/CSSPropertyParserHelpers.cpp:
(WebCore::CSSPropertyParserHelpers::parseHSLParameters):
(WebCore::CSSPropertyParserHelpers::parseColorFunction):
(WebCore::CSSPropertyParserHelpers::consumeColor):
* platform/graphics/Color.cpp:
(WebCore::calcHue):
(WebCore::makeRGBAFromHSLA):

LayoutTests:

Patch by Chris Nardi <cnardi@chromium.org> on 2018-04-20
Reviewed by Simon Fraser.

This change updates our import of web-platform-tests/css/css-color
to test the new behavior.

* TestExpectations:
* canvas/philip/tests/2d.fillStyle.parse.invalid.hsl-5-expected.txt:

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@230861 268f45cc-cd09-0410-ab3c-d52691b4dbfc

165 files changed:
LayoutTests/ChangeLog
LayoutTests/TestExpectations
LayoutTests/canvas/philip/tests/2d.fillStyle.parse.invalid.hsl-5-expected.txt
LayoutTests/imported/w3c/ChangeLog
LayoutTests/imported/w3c/canvas/2d.fillStyle.parse.invalid.hsl-5-expected.txt
LayoutTests/imported/w3c/web-platform-tests/css/css-color/OWNERS [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/border-bottom-color-expected.xht [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/border-bottom-color.xht [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/border-left-color-expected.xht [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/border-left-color.xht [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/border-right-color-expected.xht [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/border-right-color.xht [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/border-top-color-expected.xht [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/border-top-color.xht [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/color-001-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/color-001.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/color-002-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/color-002.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/color-003-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/color-003.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/currentcolor-001-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/currentcolor-001.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/currentcolor-002-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/currentcolor-002.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/hex-001-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/hex-001.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/hex-002-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/hex-002.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/hex-003-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/hex-003.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/hex-004-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/hex-004.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-001-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-001.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-002-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-002.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-003-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-003.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-004-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-004.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-005-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-005.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-006-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-006.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-007-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-007.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-008-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-008.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-001-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-001.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-002-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-002.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-003-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-003.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-004-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-004.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-005-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-005.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-006-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-006.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-007-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-007.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-008-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-008.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/htaccess [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-001-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-001.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-002-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-002.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-003-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-003.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-004-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-004.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-005-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-005.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-006-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-006.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-007-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-007.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-001-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-001.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-002-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-002.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-003-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-003.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-004-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-004.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-005-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-005.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-006-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-006.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-007-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-007.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/named-001-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/named-001.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-001-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-001.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-002-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-002.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-003-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-003.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-004-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-004.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-005-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-005.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-006-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-006.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-007-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-007.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-008-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-008.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-001-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-001.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-002-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-002.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-003-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-003.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-004-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-004.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-005-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-005.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-006-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-006.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-007-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-007.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-008-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-008.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/t31-color-text-a-expected.xht [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/t31-color-text-a.xht [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/t32-opacity-basic-0.0-a-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/t32-opacity-basic-0.0-a.xht [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/t32-opacity-basic-1.0-a-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/t32-opacity-basic-1.0-a.xht [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/t32-opacity-clamping-0.0-b-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/t32-opacity-clamping-0.0-b.xht [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/t32-opacity-clamping-1.0-b-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/t32-opacity-clamping-1.0-b.xht [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/t32-opacity-offscreen-b-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/t32-opacity-offscreen-b.xht [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/t32-opacity-offscreen-with-alpha-c-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/t32-opacity-offscreen-with-alpha-c.xht [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/t41-html4-keywords-a-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/t41-html4-keywords-a.xht [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/t421-rgb-clip-outside-gamut-b-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/t421-rgb-clip-outside-gamut-b.xht [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/t421-rgb-values-meaning-b-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/t421-rgb-values-meaning-b.xht [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/t422-rgba-a0.0-a-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/t422-rgba-a0.0-a.xht [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/t422-rgba-values-meaning-b-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/t422-rgba-values-meaning-b.xht [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/t424-hsl-h-rotating-b-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/t424-hsl-h-rotating-b.xht [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/t425-hsla-h-rotating-b-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/t425-hsla-h-rotating-b.xht [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/t425-hsla-onscreen-b-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/t425-hsla-onscreen-b.xht [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/t43-svg-keywords-a-expected.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/t43-svg-keywords-a.xht [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/t44-currentcolor-inherited-c-expected.xht [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/t44-currentcolor-inherited-c.xht [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-color/w3c-import.log [new file with mode: 0644]
Source/WebCore/ChangeLog
Source/WebCore/css/parser/CSSPropertyParserHelpers.cpp
Source/WebCore/platform/graphics/Color.cpp

index 6b4a07e..bfcdf56 100644 (file)
@@ -1,3 +1,17 @@
+2018-04-20  Chris Nardi  <cnardi@chromium.org>
+
+        Update HSL/HSLA parsing to match CSS Color 4
+        https://bugs.webkit.org/show_bug.cgi?id=180528
+        <rdar://problem/35926675>
+
+        Reviewed by Simon Fraser.
+
+        This change updates our import of web-platform-tests/css/css-color
+        to test the new behavior.
+
+        * TestExpectations:
+        * canvas/philip/tests/2d.fillStyle.parse.invalid.hsl-5-expected.txt:
+
 2018-04-20  Wenson Hsieh  <wenson_hsieh@apple.com>
 
         [Extra zoom mode] Injected bundle form client should be notified when editing text fields
index 567c6d3..8180cbd 100644 (file)
@@ -1098,6 +1098,52 @@ webkit.org/b/148650 fast/repaint/add-table-overpaint.html [ Pass Failure ]
 webkit.org/b/148801 imported/w3c/web-platform-tests/css/css-color/t422-rgba-onscreen-b.xht [ ImageOnlyFailure ]
 webkit.org/b/148801 imported/w3c/web-platform-tests/css/css-color/t422-rgba-onscreen-multiple-boxes-c.xht [ ImageOnlyFailure ]
 webkit.org/b/148801 imported/w3c/web-platform-tests/css/css-color/t425-hsla-onscreen-multiple-boxes-c.xht [ ImageOnlyFailure ]
+webkit.org/b/148801 imported/w3c/web-platform-tests/css/css-color/t425-hsla-onscreen-b.xht [ ImageOnlyFailure ]
+
+# lab/lch not supported
+imported/w3c/web-platform-tests/css/css-color/lab-001.html [ Skip ]
+imported/w3c/web-platform-tests/css/css-color/lab-002.html [ Skip ]
+imported/w3c/web-platform-tests/css/css-color/lab-003.html [ Skip ]
+imported/w3c/web-platform-tests/css/css-color/lab-004.html [ Skip ]
+imported/w3c/web-platform-tests/css/css-color/lab-005.html [ Skip ]
+imported/w3c/web-platform-tests/css/css-color/lab-006.html [ Skip ]
+imported/w3c/web-platform-tests/css/css-color/lab-007.html [ Skip ]
+imported/w3c/web-platform-tests/css/css-color/lch-001.html [ Skip ]
+imported/w3c/web-platform-tests/css/css-color/lch-002.html [ Skip ]
+imported/w3c/web-platform-tests/css/css-color/lch-003.html [ Skip ]
+imported/w3c/web-platform-tests/css/css-color/lch-004.html [ Skip ]
+imported/w3c/web-platform-tests/css/css-color/lch-005.html [ Skip ]
+imported/w3c/web-platform-tests/css/css-color/lch-006.html [ Skip ]
+imported/w3c/web-platform-tests/css/css-color/lch-007.html [ Skip ]
+
+# New rgb/rgba syntax not supported
+webkit.org/b/180209 imported/w3c/web-platform-tests/css/css-color/rgb-001.html [ Skip ]
+webkit.org/b/180209 imported/w3c/web-platform-tests/css/css-color/rgb-002.html [ Skip ]
+webkit.org/b/180209 imported/w3c/web-platform-tests/css/css-color/rgb-003.html [ Skip ]
+webkit.org/b/180209 imported/w3c/web-platform-tests/css/css-color/rgb-004.html [ Skip ]
+webkit.org/b/180209 imported/w3c/web-platform-tests/css/css-color/rgb-005.html [ Skip ]
+webkit.org/b/180209 imported/w3c/web-platform-tests/css/css-color/rgb-006.html [ Skip ]
+webkit.org/b/180209 imported/w3c/web-platform-tests/css/css-color/rgb-007.html [ Skip ]
+webkit.org/b/180209 imported/w3c/web-platform-tests/css/css-color/rgb-008.html [ Skip ]
+webkit.org/b/180209 imported/w3c/web-platform-tests/css/css-color/rgba-001.html [ Skip ]
+webkit.org/b/180209 imported/w3c/web-platform-tests/css/css-color/rgba-002.html [ Skip ]
+webkit.org/b/180209 imported/w3c/web-platform-tests/css/css-color/rgba-003.html [ Skip ]
+webkit.org/b/180209 imported/w3c/web-platform-tests/css/css-color/rgba-004.html [ Skip ]
+webkit.org/b/180209 imported/w3c/web-platform-tests/css/css-color/rgba-005.html [ Skip ]
+webkit.org/b/180209 imported/w3c/web-platform-tests/css/css-color/rgba-006.html [ Skip ]
+webkit.org/b/180209 imported/w3c/web-platform-tests/css/css-color/rgba-007.html [ Skip ]
+webkit.org/b/180209 imported/w3c/web-platform-tests/css/css-color/rgba-008.html [ Skip ]
+
+# Initial failures on the import of css-color
+imported/w3c/web-platform-tests/css/css-color/currentcolor-002.html [ ImageOnlyFailure ]
+imported/w3c/web-platform-tests/css/css-color/t31-color-text-a.xht [ ImageOnlyFailure ]
+imported/w3c/web-platform-tests/css/css-color/t32-opacity-offscreen-with-alpha-c.xht [ ImageOnlyFailure ]
+imported/w3c/web-platform-tests/css/css-color/t421-rgb-values-meaning-b.xht [ ImageOnlyFailure ]
+imported/w3c/web-platform-tests/css/css-color/t424-hsl-basic-a.xht [ ImageOnlyFailure ]
+imported/w3c/web-platform-tests/css/css-color/t424-hsl-parsing-f.xht [ ImageOnlyFailure ]
+imported/w3c/web-platform-tests/css/css-color/t425-hsla-parsing-f.xht [ ImageOnlyFailure ]
+imported/w3c/web-platform-tests/css/css-color/t425-hsla-values-b.xht [ ImageOnlyFailure ]
+imported/w3c/web-platform-tests/css/css-color/t44-currentcolor-inherited-c.xht [ ImageOnlyFailure ]
 
 # Many CSS WG multicol-1 tests fail with 1px differences
 webkit.org/b/148806 imported/w3c/web-platform-tests/css/css-multicol/multicol-count-large-001.xht [ ImageOnlyFailure ]
index 4f8b732..619076e 100644 (file)
@@ -1,3 +1,224 @@
+2018-04-20  Chris Nardi  <cnardi@chromium.org>
+
+        Update HSL/HSLA parsing to match CSS Color 4
+        https://bugs.webkit.org/show_bug.cgi?id=180528
+        <rdar://problem/35926675>
+
+        Reviewed by Simon Fraser.
+
+        CSS Color 4 had many changes to the HSL/HSLA functions, including allowing angles to be
+        specified as the hue, adding a comma optional syntax, making the two functions synonyms
+        so each function can take an alpha value, and allowing percent alpha values. This change
+        updates our behavior to match that, and updates the HSL to RGB algorithm.
+
+        This change also updates the import of WPT css-color to test the changes.
+
+        * canvas/2d.fillStyle.parse.invalid.hsl-5-expected.txt:
+        * web-platform-tests/css/css-color/OWNERS: Added.
+        * web-platform-tests/css/css-color/border-bottom-color-expected.xht: Added.
+        * web-platform-tests/css/css-color/border-bottom-color.xht: Added.
+        * web-platform-tests/css/css-color/border-left-color-expected.xht: Added.
+        * web-platform-tests/css/css-color/border-left-color.xht: Added.
+        * web-platform-tests/css/css-color/border-right-color-expected.xht: Added.
+        * web-platform-tests/css/css-color/border-right-color.xht: Added.
+        * web-platform-tests/css/css-color/border-top-color-expected.xht: Added.
+        * web-platform-tests/css/css-color/border-top-color.xht: Added.
+        * web-platform-tests/css/css-color/color-001-expected.html: Added.
+        * web-platform-tests/css/css-color/color-001.html: Added.
+        * web-platform-tests/css/css-color/color-002-expected.html: Added.
+        * web-platform-tests/css/css-color/color-002.html: Added.
+        * web-platform-tests/css/css-color/color-003-expected.html: Added.
+        * web-platform-tests/css/css-color/color-003.html: Added.
+        * web-platform-tests/css/css-color/currentcolor-001-expected.html: Added.
+        * web-platform-tests/css/css-color/currentcolor-001.html: Added.
+        * web-platform-tests/css/css-color/currentcolor-002-expected.html: Added.
+        * web-platform-tests/css/css-color/currentcolor-002.html: Added.
+        * web-platform-tests/css/css-color/hex-001-expected.html: Added.
+        * web-platform-tests/css/css-color/hex-001.html: Added.
+        * web-platform-tests/css/css-color/hex-002-expected.html: Added.
+        * web-platform-tests/css/css-color/hex-002.html: Added.
+        * web-platform-tests/css/css-color/hex-003-expected.html: Added.
+        * web-platform-tests/css/css-color/hex-003.html: Added.
+        * web-platform-tests/css/css-color/hex-004-expected.html: Added.
+        * web-platform-tests/css/css-color/hex-004.html: Added.
+        * web-platform-tests/css/css-color/hsl-001-expected.html: Added.
+        * web-platform-tests/css/css-color/hsl-001.html: Added.
+        * web-platform-tests/css/css-color/hsl-002-expected.html: Added.
+        * web-platform-tests/css/css-color/hsl-002.html: Added.
+        * web-platform-tests/css/css-color/hsl-003-expected.html: Added.
+        * web-platform-tests/css/css-color/hsl-003.html: Added.
+        * web-platform-tests/css/css-color/hsl-004-expected.html: Added.
+        * web-platform-tests/css/css-color/hsl-004.html: Added.
+        * web-platform-tests/css/css-color/hsl-005-expected.html: Added.
+        * web-platform-tests/css/css-color/hsl-005.html: Added.
+        * web-platform-tests/css/css-color/hsl-006-expected.html: Added.
+        * web-platform-tests/css/css-color/hsl-006.html: Added.
+        * web-platform-tests/css/css-color/hsl-007-expected.html: Added.
+        * web-platform-tests/css/css-color/hsl-007.html: Added.
+        * web-platform-tests/css/css-color/hsl-008-expected.html: Added.
+        * web-platform-tests/css/css-color/hsl-008.html: Added.
+        * web-platform-tests/css/css-color/hsla-001-expected.html: Added.
+        * web-platform-tests/css/css-color/hsla-001.html: Added.
+        * web-platform-tests/css/css-color/hsla-002-expected.html: Added.
+        * web-platform-tests/css/css-color/hsla-002.html: Added.
+        * web-platform-tests/css/css-color/hsla-003-expected.html: Added.
+        * web-platform-tests/css/css-color/hsla-003.html: Added.
+        * web-platform-tests/css/css-color/hsla-004-expected.html: Added.
+        * web-platform-tests/css/css-color/hsla-004.html: Added.
+        * web-platform-tests/css/css-color/hsla-005-expected.html: Added.
+        * web-platform-tests/css/css-color/hsla-005.html: Added.
+        * web-platform-tests/css/css-color/hsla-006-expected.html: Added.
+        * web-platform-tests/css/css-color/hsla-006.html: Added.
+        * web-platform-tests/css/css-color/hsla-007-expected.html: Added.
+        * web-platform-tests/css/css-color/hsla-007.html: Added.
+        * web-platform-tests/css/css-color/hsla-008-expected.html: Added.
+        * web-platform-tests/css/css-color/hsla-008.html: Added.
+        * web-platform-tests/css/css-color/htaccess: Added.
+        * web-platform-tests/css/css-color/lab-001-expected.html: Added.
+        * web-platform-tests/css/css-color/lab-001.html: Added.
+        * web-platform-tests/css/css-color/lab-002-expected.html: Added.
+        * web-platform-tests/css/css-color/lab-002.html: Added.
+        * web-platform-tests/css/css-color/lab-003-expected.html: Added.
+        * web-platform-tests/css/css-color/lab-003.html: Added.
+        * web-platform-tests/css/css-color/lab-004-expected.html: Added.
+        * web-platform-tests/css/css-color/lab-004.html: Added.
+        * web-platform-tests/css/css-color/lab-005-expected.html: Added.
+        * web-platform-tests/css/css-color/lab-005.html: Added.
+        * web-platform-tests/css/css-color/lab-006-expected.html: Added.
+        * web-platform-tests/css/css-color/lab-006.html: Added.
+        * web-platform-tests/css/css-color/lab-007-expected.html: Added.
+        * web-platform-tests/css/css-color/lab-007.html: Added.
+        * web-platform-tests/css/css-color/lch-001-expected.html: Added.
+        * web-platform-tests/css/css-color/lch-001.html: Added.
+        * web-platform-tests/css/css-color/lch-002-expected.html: Added.
+        * web-platform-tests/css/css-color/lch-002.html: Added.
+        * web-platform-tests/css/css-color/lch-003-expected.html: Added.
+        * web-platform-tests/css/css-color/lch-003.html: Added.
+        * web-platform-tests/css/css-color/lch-004-expected.html: Added.
+        * web-platform-tests/css/css-color/lch-004.html: Added.
+        * web-platform-tests/css/css-color/lch-005-expected.html: Added.
+        * web-platform-tests/css/css-color/lch-005.html: Added.
+        * web-platform-tests/css/css-color/lch-006-expected.html: Added.
+        * web-platform-tests/css/css-color/lch-006.html: Added.
+        * web-platform-tests/css/css-color/lch-007-expected.html: Added.
+        * web-platform-tests/css/css-color/lch-007.html: Added.
+        * web-platform-tests/css/css-color/named-001-expected.html: Added.
+        * web-platform-tests/css/css-color/named-001.html: Added.
+        * web-platform-tests/css/css-color/rgb-001-expected.html: Added.
+        * web-platform-tests/css/css-color/rgb-001.html: Added.
+        * web-platform-tests/css/css-color/rgb-002-expected.html: Added.
+        * web-platform-tests/css/css-color/rgb-002.html: Added.
+        * web-platform-tests/css/css-color/rgb-003-expected.html: Added.
+        * web-platform-tests/css/css-color/rgb-003.html: Added.
+        * web-platform-tests/css/css-color/rgb-004-expected.html: Added.
+        * web-platform-tests/css/css-color/rgb-004.html: Added.
+        * web-platform-tests/css/css-color/rgb-005-expected.html: Added.
+        * web-platform-tests/css/css-color/rgb-005.html: Added.
+        * web-platform-tests/css/css-color/rgb-006-expected.html: Added.
+        * web-platform-tests/css/css-color/rgb-006.html: Added.
+        * web-platform-tests/css/css-color/rgb-007-expected.html: Added.
+        * web-platform-tests/css/css-color/rgb-007.html: Added.
+        * web-platform-tests/css/css-color/rgb-008-expected.html: Added.
+        * web-platform-tests/css/css-color/rgb-008.html: Added.
+        * web-platform-tests/css/css-color/rgba-001-expected.html: Added.
+        * web-platform-tests/css/css-color/rgba-001.html: Added.
+        * web-platform-tests/css/css-color/rgba-002-expected.html: Added.
+        * web-platform-tests/css/css-color/rgba-002.html: Added.
+        * web-platform-tests/css/css-color/rgba-003-expected.html: Added.
+        * web-platform-tests/css/css-color/rgba-003.html: Added.
+        * web-platform-tests/css/css-color/rgba-004-expected.html: Added.
+        * web-platform-tests/css/css-color/rgba-004.html: Added.
+        * web-platform-tests/css/css-color/rgba-005-expected.html: Added.
+        * web-platform-tests/css/css-color/rgba-005.html: Added.
+        * web-platform-tests/css/css-color/rgba-006-expected.html: Added.
+        * web-platform-tests/css/css-color/rgba-006.html: Added.
+        * web-platform-tests/css/css-color/rgba-007-expected.html: Added.
+        * web-platform-tests/css/css-color/rgba-007.html: Added.
+        * web-platform-tests/css/css-color/rgba-008-expected.html: Added.
+        * web-platform-tests/css/css-color/rgba-008.html: Added.
+        * web-platform-tests/css/css-color/t31-color-currentColor-b.xht:
+        * web-platform-tests/css/css-color/t31-color-text-a-expected.xht: Added.
+        * web-platform-tests/css/css-color/t31-color-text-a.xht: Added.
+        * web-platform-tests/css/css-color/t32-opacity-basic-0.0-a-expected.html: Added.
+        * web-platform-tests/css/css-color/t32-opacity-basic-0.0-a.xht: Added.
+        * web-platform-tests/css/css-color/t32-opacity-basic-1.0-a-expected.html: Added.
+        * web-platform-tests/css/css-color/t32-opacity-basic-1.0-a.xht: Added.
+        * web-platform-tests/css/css-color/t32-opacity-clamping-0.0-b-expected.html: Added.
+        * web-platform-tests/css/css-color/t32-opacity-clamping-0.0-b.xht: Added.
+        * web-platform-tests/css/css-color/t32-opacity-clamping-1.0-b-expected.html: Added.
+        * web-platform-tests/css/css-color/t32-opacity-clamping-1.0-b.xht: Added.
+        * web-platform-tests/css/css-color/t32-opacity-offscreen-b-expected.html: Added.
+        * web-platform-tests/css/css-color/t32-opacity-offscreen-b.xht: Added.
+        * web-platform-tests/css/css-color/t32-opacity-offscreen-multiple-boxes-1-c.xht:
+        * web-platform-tests/css/css-color/t32-opacity-offscreen-multiple-boxes-2-c.xht:
+        * web-platform-tests/css/css-color/t32-opacity-offscreen-with-alpha-c-expected.html: Added.
+        * web-platform-tests/css/css-color/t32-opacity-offscreen-with-alpha-c.xht: Added.
+        * web-platform-tests/css/css-color/t41-html4-keywords-a-expected.html: Added.
+        * web-platform-tests/css/css-color/t41-html4-keywords-a.xht: Added.
+        * web-platform-tests/css/css-color/t421-rgb-clip-outside-gamut-b-expected.html: Added.
+        * web-platform-tests/css/css-color/t421-rgb-clip-outside-gamut-b.xht: Added.
+        * web-platform-tests/css/css-color/t421-rgb-func-int-a.xht:
+        * web-platform-tests/css/css-color/t421-rgb-func-no-mixed-f.xht:
+        * web-platform-tests/css/css-color/t421-rgb-func-pct-a.xht:
+        * web-platform-tests/css/css-color/t421-rgb-func-whitespace-b.xht:
+        * web-platform-tests/css/css-color/t421-rgb-hex-parsing-f.xht:
+        * web-platform-tests/css/css-color/t421-rgb-hex3-a.xht:
+        * web-platform-tests/css/css-color/t421-rgb-hex6-a.xht:
+        * web-platform-tests/css/css-color/t421-rgb-values-meaning-b-expected.html: Added.
+        * web-platform-tests/css/css-color/t421-rgb-values-meaning-b.xht: Added.
+        * web-platform-tests/css/css-color/t422-rgba-a0.0-a-expected.html: Added.
+        * web-platform-tests/css/css-color/t422-rgba-a0.0-a.xht: Added.
+        * web-platform-tests/css/css-color/t422-rgba-a1.0-a.xht:
+        * web-platform-tests/css/css-color/t422-rgba-clamping-a0.0-b.xht:
+        * web-platform-tests/css/css-color/t422-rgba-clamping-a1.0-b.xht:
+        * web-platform-tests/css/css-color/t422-rgba-clip-outside-device-gamut-b.xht:
+        * web-platform-tests/css/css-color/t422-rgba-func-int-a.xht:
+        * web-platform-tests/css/css-color/t422-rgba-func-no-mixed-f.xht:
+        * web-platform-tests/css/css-color/t422-rgba-func-pct-a.xht:
+        * web-platform-tests/css/css-color/t422-rgba-func-whitespace-b.xht:
+        * web-platform-tests/css/css-color/t422-rgba-onscreen-b.xht:
+        * web-platform-tests/css/css-color/t422-rgba-onscreen-multiple-boxes-c.xht:
+        * web-platform-tests/css/css-color/t422-rgba-values-meaning-b-expected.html: Added.
+        * web-platform-tests/css/css-color/t422-rgba-values-meaning-b.xht: Added.
+        * web-platform-tests/css/css-color/t423-transparent-1-a.xht:
+        * web-platform-tests/css/css-color/t423-transparent-2-a.xht:
+        * web-platform-tests/css/css-color/t424-hsl-basic-a.xht:
+        * web-platform-tests/css/css-color/t424-hsl-clip-outside-gamut-b.xht:
+        * web-platform-tests/css/css-color/t424-hsl-h-rotating-b-expected.html: Added.
+        * web-platform-tests/css/css-color/t424-hsl-h-rotating-b.xht: Added.
+        * web-platform-tests/css/css-color/t424-hsl-parsing-f.xht:
+        * web-platform-tests/css/css-color/t424-hsl-values-b-1.html:
+        * web-platform-tests/css/css-color/t424-hsl-values-b-10.html:
+        * web-platform-tests/css/css-color/t424-hsl-values-b-11.html:
+        * web-platform-tests/css/css-color/t424-hsl-values-b-12.html:
+        * web-platform-tests/css/css-color/t424-hsl-values-b-13.html:
+        * web-platform-tests/css/css-color/t424-hsl-values-b-14.html:
+        * web-platform-tests/css/css-color/t424-hsl-values-b-15.html:
+        * web-platform-tests/css/css-color/t424-hsl-values-b-2.html:
+        * web-platform-tests/css/css-color/t424-hsl-values-b-3.html:
+        * web-platform-tests/css/css-color/t424-hsl-values-b-4.html:
+        * web-platform-tests/css/css-color/t424-hsl-values-b-5.html:
+        * web-platform-tests/css/css-color/t424-hsl-values-b-6.html:
+        * web-platform-tests/css/css-color/t424-hsl-values-b-7.html:
+        * web-platform-tests/css/css-color/t424-hsl-values-b-8.html:
+        * web-platform-tests/css/css-color/t424-hsl-values-b-9.html:
+        * web-platform-tests/css/css-color/t425-hsla-clip-outside-device-gamut-b.xht:
+        * web-platform-tests/css/css-color/t425-hsla-h-rotating-b-expected.html: Added.
+        * web-platform-tests/css/css-color/t425-hsla-h-rotating-b.xht: Added.
+        * web-platform-tests/css/css-color/t425-hsla-onscreen-b-expected.html: Added.
+        * web-platform-tests/css/css-color/t425-hsla-onscreen-b.xht: Added.
+        * web-platform-tests/css/css-color/t425-hsla-onscreen-multiple-boxes-c.xht:
+        * web-platform-tests/css/css-color/t425-hsla-parsing-f.xht:
+        * web-platform-tests/css/css-color/t425-hsla-values-b.xht:
+        * web-platform-tests/css/css-color/t43-svg-keywords-a-expected.html: Added.
+        * web-platform-tests/css/css-color/t43-svg-keywords-a.xht: Added.
+        * web-platform-tests/css/css-color/t44-currentcolor-background-b.xht:
+        * web-platform-tests/css/css-color/t44-currentcolor-border-b-expected.html:
+        * web-platform-tests/css/css-color/t44-currentcolor-border-b.xht:
+        * web-platform-tests/css/css-color/t44-currentcolor-inherited-c-expected.xht: Added.
+        * web-platform-tests/css/css-color/t44-currentcolor-inherited-c.xht: Added.
+        * web-platform-tests/css/css-color/w3c-import.log: Added.
+
 2018-04-20  Javier Fernandez  <jfernandez@igalia.com>
 
         Update Alignment shorthands to the spec now that they are not ambiguous
index cb33c09..b1e315f 100644 (file)
@@ -3,4 +3,4 @@ Spec references: 2d.colours.parse
 Actual output:
 Expected output:
 
-Passed
+Failed assertion: got pixel [255,255,255,255] at (50,25), expected [0,255,0,255]
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/OWNERS b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/OWNERS
new file mode 100644 (file)
index 0000000..567cfca
--- /dev/null
@@ -0,0 +1,6 @@
+@dbaron
+@JianfengXu
+@chenxix
+@tantek
+@svgeesus
+@tabatkins
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/border-bottom-color-expected.xht b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/border-bottom-color-expected.xht
new file mode 100644 (file)
index 0000000..28f6784
--- /dev/null
@@ -0,0 +1,19 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+<head>
+<title>CSS Reftest Reference</title>
+<link rel="author" title="Jack Moffitt" href="http://metajack.im/"/>
+<link rel="author" title="Ms2ger" href="mailto:Ms2ger@gmail.com"/>
+<style type="text/css">
+div {
+    border: 5px solid blue;
+    height: 1in;
+    width: 1in;
+}
+</style>
+</head>
+<body>
+<p>Test passes if there is a transparent square surrounded by a blue border.</p>
+<div></div>
+</body>
+</html>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/border-bottom-color.xht b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/border-bottom-color.xht
new file mode 100644 (file)
index 0000000..994bb4e
--- /dev/null
@@ -0,0 +1,33 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Border-bottom-color set to hex with three digits with the maximum plus one value of #1000</title>
+        <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+        <link rel="author" title="Jack Moffitt" href="http://metajack.im/"/>
+        <link rel="author" title="Ms2ger" href="mailto:Ms2ger@gmail.com"/>
+        <link rel="help" href="https://drafts.csswg.org/css-color-4/#hex-notation"/>
+        <link rel="match" href="border-color-ref.xht"/>
+
+        <meta name="assert" content="The 'border-bottom-color' set to #1000 is a transparent dark red square." />
+        <style type="text/css">
+            div.test
+            {
+                border: 5px solid blue;
+                height: 1in;
+                width: 1in;
+            }
+            div.test div
+            {
+                border-bottom-style: solid;
+                border-bottom-width: 1in;
+                border-bottom-color: #1000;
+                height: 0;
+                width: 1in;
+            }
+        </style>
+    </head>
+    <body>
+        <p>Test passes if there is a transparent square surrounded by a blue border.</p>
+        <div class="test"><div></div></div>
+    </body>
+</html>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/border-left-color-expected.xht b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/border-left-color-expected.xht
new file mode 100644 (file)
index 0000000..28f6784
--- /dev/null
@@ -0,0 +1,19 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+<head>
+<title>CSS Reftest Reference</title>
+<link rel="author" title="Jack Moffitt" href="http://metajack.im/"/>
+<link rel="author" title="Ms2ger" href="mailto:Ms2ger@gmail.com"/>
+<style type="text/css">
+div {
+    border: 5px solid blue;
+    height: 1in;
+    width: 1in;
+}
+</style>
+</head>
+<body>
+<p>Test passes if there is a transparent square surrounded by a blue border.</p>
+<div></div>
+</body>
+</html>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/border-left-color.xht b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/border-left-color.xht
new file mode 100644 (file)
index 0000000..3214f2d
--- /dev/null
@@ -0,0 +1,33 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Border-left-color set to hex with three digits with the maximum plus one value of #1000</title>
+        <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+        <link rel="author" title="Jack Moffitt" href="http://metajack.im/"/>
+        <link rel="author" title="Ms2ger" href="mailto:Ms2ger@gmail.com"/>
+        <link rel="help" href="https://drafts.csswg.org/css-color-4/#hex-notation"/>
+        <link rel="match" href="border-color-ref.xht"/>
+
+        <meta name="assert" content="The 'border-top-color' set to #1000 is a transparent dark red square." />
+        <style type="text/css">
+            div.test
+            {
+                border: 5px solid blue;
+                height: 1in;
+                width: 1in;
+            }
+            div.test div
+            {
+                border-left-style: solid;
+                border-left-width: 1in;
+                border-left-color: #1000;
+                height: 1in;
+                width: 0;
+            }
+        </style>
+    </head>
+    <body>
+        <p>Test passes if there is a transparent square surrounded by a blue border.</p>
+        <div class="test"><div></div></div>
+    </body>
+</html>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/border-right-color-expected.xht b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/border-right-color-expected.xht
new file mode 100644 (file)
index 0000000..28f6784
--- /dev/null
@@ -0,0 +1,19 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+<head>
+<title>CSS Reftest Reference</title>
+<link rel="author" title="Jack Moffitt" href="http://metajack.im/"/>
+<link rel="author" title="Ms2ger" href="mailto:Ms2ger@gmail.com"/>
+<style type="text/css">
+div {
+    border: 5px solid blue;
+    height: 1in;
+    width: 1in;
+}
+</style>
+</head>
+<body>
+<p>Test passes if there is a transparent square surrounded by a blue border.</p>
+<div></div>
+</body>
+</html>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/border-right-color.xht b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/border-right-color.xht
new file mode 100644 (file)
index 0000000..70f7721
--- /dev/null
@@ -0,0 +1,33 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Border-right-color set to hex with three digits with the maximum plus one value of #1000</title>
+        <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+        <link rel="author" title="Jack Moffitt" href="http://metajack.im/"/>
+        <link rel="author" title="Ms2ger" href="mailto:Ms2ger@gmail.com"/>
+        <link rel="help" href="https://drafts.csswg.org/css-color-4/#hex-notation"/>
+        <link rel="match" href="border-color-ref.xht"/>
+
+        <meta name="assert" content="The 'border-right-color' set to #1000 is a transparent dark red square." />
+        <style type="text/css">
+            div.test
+            {
+                border: 5px solid blue;
+                height: 1in;
+                width: 1in;
+            }
+            div.test div
+            {
+                border-right-style: solid;
+                border-right-width: 1in;
+                border-right-color: #1000;
+                height: 1in;
+                width: 0;
+            }
+        </style>
+    </head>
+    <body>
+        <p>Test passes if there is a transparent square surrounded by a blue border.</p>
+        <div class="test"><div></div></div>
+    </body>
+</html>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/border-top-color-expected.xht b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/border-top-color-expected.xht
new file mode 100644 (file)
index 0000000..28f6784
--- /dev/null
@@ -0,0 +1,19 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+<head>
+<title>CSS Reftest Reference</title>
+<link rel="author" title="Jack Moffitt" href="http://metajack.im/"/>
+<link rel="author" title="Ms2ger" href="mailto:Ms2ger@gmail.com"/>
+<style type="text/css">
+div {
+    border: 5px solid blue;
+    height: 1in;
+    width: 1in;
+}
+</style>
+</head>
+<body>
+<p>Test passes if there is a transparent square surrounded by a blue border.</p>
+<div></div>
+</body>
+</html>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/border-top-color.xht b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/border-top-color.xht
new file mode 100644 (file)
index 0000000..706da7e
--- /dev/null
@@ -0,0 +1,33 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Border-top-color set to hex with three digits with the maximum plus one value of #1000</title>
+        <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+        <link rel="author" title="Jack Moffitt" href="http://metajack.im/"/>
+        <link rel="author" title="Ms2ger" href="mailto:Ms2ger@gmail.com"/>
+        <link rel="help" href="https://drafts.csswg.org/css-color-4/#hex-notation"/>
+        <link rel="match" href="border-color-ref.xht"/>
+
+        <meta name="assert" content="The 'border-top-color' set to #1000 is a transparent dark red square." />
+        <style type="text/css">
+            div.test
+            {
+                border: 5px solid blue;
+                height: 1in;
+                width: 1in;
+            }
+            div.test div
+            {
+                border-top-style: solid;
+                border-top-width: 1in;
+                border-top-color: #1000;
+                height: 0;
+                width: 1in;
+            }
+        </style>
+    </head>
+    <body>
+        <p>Test passes if there is a transparent square surrounded by a blue border.</p>
+        <div class="test"><div></div></div>
+    </body>
+</html>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/color-001-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/color-001-expected.html
new file mode 100644 (file)
index 0000000..1f6d079
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green text reference</title>
+<style>
+    .test { color: #008000}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/color-001.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/color-001.html
new file mode 100644 (file)
index 0000000..580307b
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: color property</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#the-color-property">
+<link rel="match" href="greentext-ref.html">
+<meta name="assert" content="This property describes the foreground fill color of an element’s text content.">
+<style>
+    .test {color: green}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/color-002-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/color-002-expected.html
new file mode 100644 (file)
index 0000000..ddfa910
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Black text reference</title>
+<style>
+    .test { color: #000000}
+</style>
+<body>
+    <p class="test">Test passes if this text is black</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/color-002.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/color-002.html
new file mode 100644 (file)
index 0000000..7d2f5b3
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: color property, initial value</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#the-color-property">
+<link rel="match" href="blacktext-ref.html">
+<meta name="assert" content="The initial value of this property is black.">
+<style>
+    .test {color: initial}
+</style>
+<body>
+    <p class="test">Test passes if this text is black</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/color-003-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/color-003-expected.html
new file mode 100644 (file)
index 0000000..1f6d079
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green text reference</title>
+<style>
+    .test { color: #008000}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/color-003.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/color-003.html
new file mode 100644 (file)
index 0000000..c9ed7c7
--- /dev/null
@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: color property, initial value</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#the-color-property">
+<link rel="match" href="greentext-ref.html">
+<meta name="assert" content="If the currentcolor keyword is set on the color property itself, it is treated as color: inherit.">
+<style>
+    .outer {color: green;}
+    .inner {color: currentcolor;}
+</style>
+<body>
+    <p class="outer"><span class="inner">Test passes if this text is green</span></p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/currentcolor-001-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/currentcolor-001-expected.html
new file mode 100644 (file)
index 0000000..35a31f8
--- /dev/null
@@ -0,0 +1,10 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green square reference</title>
+<style>
+    .test { background-color: #008000; width: 12em; height: 12em;}
+</style>
+<body>
+    <p>Test passes if you see a green square, and no red.</p>
+    <div class="test"></div>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/currentcolor-001.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/currentcolor-001.html
new file mode 100644 (file)
index 0000000..e08129e
--- /dev/null
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: currentcolor</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#currentcolor-color">
+<link rel="match" href="greensquare-ref.html">
+<meta name="assert" content="The keyword currentcolor takes its value from the value of the color property on the same element.">
+<style>
+    .outer {color: red; background-color: red; font-size: 200%; width: 6em; height: 6em; }
+    .inner {color: green; background-color: currentColor; width: 6em; height: 6em; font-weight: bold;}
+</style>
+<body>
+    <p>Test passes if you see a green square, and no red.</p>
+    <div class="outer"><div class="inner">FAIL</div></div>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/currentcolor-002-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/currentcolor-002-expected.html
new file mode 100644 (file)
index 0000000..35a31f8
--- /dev/null
@@ -0,0 +1,10 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green square reference</title>
+<style>
+    .test { background-color: #008000; width: 12em; height: 12em;}
+</style>
+<body>
+    <p>Test passes if you see a green square, and no red.</p>
+    <div class="test"></div>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/currentcolor-002.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/currentcolor-002.html
new file mode 100644 (file)
index 0000000..aa5d736
--- /dev/null
@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: currentcolor</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#currentcolor-color">
+<link rel="match" href="greensquare-ref.html">
+<meta name="assert" content="This happens at used-value time, which means that if the value is inherited, it’s inherited as currentcolor, not as the value of the color property, so descendants will use their own color property to resolve it.">
+<style>
+    .outer {color: red; background-color: currentColor; font-size: 200%; width: 6em; height: 6em; }
+    .middle {background-color: inherit; width: 6em; height: 6em;}
+    .inner {color: green; background-color: inherit; width: 6em; height: 6em; font-weight: bold;}
+</style>
+<body>
+    <p>Test passes if you see a green square, and no red.</p>
+    <div class="outer"><div class="middle"><div class="inner">FAIL</div></div></div>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hex-001-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hex-001-expected.html
new file mode 100644 (file)
index 0000000..1f6d079
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green text reference</title>
+<style>
+    .test { color: #008000}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hex-001.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hex-001.html
new file mode 100644 (file)
index 0000000..4ff5cdb
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: The RGB hexadecimal notations: #RRGGBB</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#hex-notation">
+<link rel="match" href="greentext-ref.html">
+<meta name="assert" content="6 digit hex">
+<style>
+    .test {color: #008000}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hex-002-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hex-002-expected.html
new file mode 100644 (file)
index 0000000..1f6d079
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green text reference</title>
+<style>
+    .test { color: #008000}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hex-002.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hex-002.html
new file mode 100644 (file)
index 0000000..5e0d48a
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: The RGB hexadecimal notations: #RRGGBB</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#hex-notation">
+<link rel="match" href="greentext-ref.html">
+<meta name="assert" content="8 digit hex, fully opaque">
+<style>
+    .test {color: #008000FF}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hex-003-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hex-003-expected.html
new file mode 100644 (file)
index 0000000..613528e
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green text reference for hex shorthand tests</title>
+<style>
+    .test { color: #007700}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hex-003.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hex-003.html
new file mode 100644 (file)
index 0000000..a6a19ad
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: The RGB hexadecimal notations: #RRGGBB</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#hex-notation">
+<link rel="match" href="hex-003-ref.html">
+<meta name="assert" content="3 digit hex">
+<style>
+    .test {color: #070}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hex-004-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hex-004-expected.html
new file mode 100644 (file)
index 0000000..613528e
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green text reference for hex shorthand tests</title>
+<style>
+    .test { color: #007700}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hex-004.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hex-004.html
new file mode 100644 (file)
index 0000000..074fb1d
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: The RGB hexadecimal notations: #RRGGBB</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#hex-notation">
+<meta name="assert" content="4 digit hex, fully opaque">
+<link rel="match" href="hex-003-ref.html">
+<style>
+    .test {color: #070F}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-001-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-001-expected.html
new file mode 100644 (file)
index 0000000..1f6d079
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green text reference</title>
+<style>
+    .test { color: #008000}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-001.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-001.html
new file mode 100644 (file)
index 0000000..842dbb9
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: HSL functions hsl() and hsla()</title>
+<link rel="author" title="Chris Nardi" href="mailto:csnardi1@gmail.com">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#the-hsl-notation">
+<link rel="match" href="greentext-ref.html">
+<meta name="assert" content="hsl() with number and no alpha, also no comma">
+<style>
+    .test {color: hsl(120 100% 25%)}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-002-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-002-expected.html
new file mode 100644 (file)
index 0000000..1f6d079
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green text reference</title>
+<style>
+    .test { color: #008000}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-002.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-002.html
new file mode 100644 (file)
index 0000000..91750d4
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: HSL functions hsl() and hsla()</title>
+<link rel="author" title="Chris Nardi" href="mailto:csnardi1@gmail.com">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#the-hsl-notation">
+<link rel="match" href="greentext-ref.html">
+<meta name="assert" content="hsl() with angle and no alpha, also no comma">
+<style>
+    .test {color: hsl(120deg 100% 25%)}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-003-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-003-expected.html
new file mode 100644 (file)
index 0000000..1f6d079
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green text reference</title>
+<style>
+    .test { color: #008000}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-003.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-003.html
new file mode 100644 (file)
index 0000000..5b6bb4b
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: HSL functions hsl() and hsla()</title>
+<link rel="author" title="Chris Nardi" href="mailto:csnardi1@gmail.com">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#the-hsl-notation">
+<link rel="match" href="greentext-ref.html">
+<meta name="assert" content="hsl() with number and numeric alpha, also no comma">
+<style>
+    .test {color: hsl(120 100% 25% / 1.0)}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-004-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-004-expected.html
new file mode 100644 (file)
index 0000000..1f6d079
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green text reference</title>
+<style>
+    .test { color: #008000}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-004.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-004.html
new file mode 100644 (file)
index 0000000..483c821
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: HSL functions hsl() and hsla()</title>
+<link rel="author" title="Chris Nardi" href="mailto:csnardi1@gmail.com">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#the-hsl-notation">
+<link rel="match" href="greentext-ref.html">
+<meta name="assert" content="hsl() with angle and numeric alpha, also no comma">
+<style>
+    .test {color: hsl(120deg 100% 25% / 1)}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-005-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-005-expected.html
new file mode 100644 (file)
index 0000000..1f6d079
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green text reference</title>
+<style>
+    .test { color: #008000}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-005.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-005.html
new file mode 100644 (file)
index 0000000..b0970c3
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: HSL functions hsl() and hsla()</title>
+<link rel="author" title="Chris Nardi" href="mailto:csnardi1@gmail.com">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#the-hsl-notation">
+<link rel="match" href="greentext-ref.html">
+<meta name="assert" content="hsl() with number and percent alpha, also no comma">
+<style>
+    .test {color: hsl(120 100% 25% / 100%)}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-006-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-006-expected.html
new file mode 100644 (file)
index 0000000..1f6d079
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green text reference</title>
+<style>
+    .test { color: #008000}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-006.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-006.html
new file mode 100644 (file)
index 0000000..389c5a4
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: HSL functions hsl() and hsla()</title>
+<link rel="author" title="Chris Nardi" href="mailto:csnardi1@gmail.com">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#the-hsl-notation">
+<link rel="match" href="greentext-ref.html">
+<meta name="assert" content="hsl() with angle and percent alpha, also no comma">
+<style>
+    .test {color: hsl(120deg 100% 25% / 100%)}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-007-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-007-expected.html
new file mode 100644 (file)
index 0000000..1f6d079
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green text reference</title>
+<style>
+    .test { color: #008000}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-007.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-007.html
new file mode 100644 (file)
index 0000000..18bbe40
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: HSL functions hsl() and hsla()</title>
+<link rel="author" title="Chris Nardi" href="mailto:csnardi1@gmail.com">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#the-hsl-notation">
+<link rel="match" href="greentext-ref.html">
+<meta name="assert" content="legacy hsl() with number and percent alpha, and commas">
+<style>
+    .test {color: hsl(120, 100%, 25%, 100%)}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-008-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-008-expected.html
new file mode 100644 (file)
index 0000000..1f6d079
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green text reference</title>
+<style>
+    .test { color: #008000}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-008.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsl-008.html
new file mode 100644 (file)
index 0000000..89b9621
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: HSL functions hsl() and hsla()</title>
+<link rel="author" title="Chris Nardi" href="mailto:csnardi1@gmail.com">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#the-hsl-notation">
+<link rel="match" href="greentext-ref.html">
+<meta name="assert" content="legacy hsl() with angle and percent alpha, with commas">
+<style>
+    .test {color: hsl(120deg, 100%, 25%, 100%)}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-001-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-001-expected.html
new file mode 100644 (file)
index 0000000..1f6d079
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green text reference</title>
+<style>
+    .test { color: #008000}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-001.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-001.html
new file mode 100644 (file)
index 0000000..9e5bbfa
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: HSL functions hsl() and hsla()</title>
+<link rel="author" title="Chris Nardi" href="mailto:csnardi1@gmail.com">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#the-hsl-notation">
+<link rel="match" href="greentext-ref.html">
+<meta name="assert" content="legacy hsla() with number and no alpha, also no comma">
+<style>
+    .test {color: hsla(120 100% 25%)}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-002-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-002-expected.html
new file mode 100644 (file)
index 0000000..1f6d079
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green text reference</title>
+<style>
+    .test { color: #008000}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-002.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-002.html
new file mode 100644 (file)
index 0000000..8b9cff8
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: HSL functions hsl() and hsla()</title>
+<link rel="author" title="Chris Nardi" href="mailto:csnardi1@gmail.com">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#the-hsl-notation">
+<link rel="match" href="greentext-ref.html">
+<meta name="assert" content="legacy hsla() with angle and no alpha, also no comma">
+<style>
+    .test {color: hsla(120deg 100% 25%)}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-003-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-003-expected.html
new file mode 100644 (file)
index 0000000..1f6d079
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green text reference</title>
+<style>
+    .test { color: #008000}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-003.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-003.html
new file mode 100644 (file)
index 0000000..3aadd8e
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: HSL functions hsl() and hsla()</title>
+<link rel="author" title="Chris Nardi" href="mailto:csnardi1@gmail.com">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#the-hsl-notation">
+<link rel="match" href="greentext-ref.html">
+<meta name="assert" content="legacy hsla() with number and numeric alpha, also no comma">
+<style>
+    .test {color: hsla(120 100% 25% / 1.0)}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-004-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-004-expected.html
new file mode 100644 (file)
index 0000000..1f6d079
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green text reference</title>
+<style>
+    .test { color: #008000}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-004.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-004.html
new file mode 100644 (file)
index 0000000..e68669f
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: HSL functions hsl() and hsla()</title>
+<link rel="author" title="Chris Nardi" href="mailto:csnardi1@gmail.com">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#the-hsl-notation">
+<link rel="match" href="greentext-ref.html">
+<meta name="assert" content="legacy hsla() with angle and numeric alpha, also no comma">
+<style>
+    .test {color: hsla(120deg 100% 25% / 1)}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-005-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-005-expected.html
new file mode 100644 (file)
index 0000000..1f6d079
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green text reference</title>
+<style>
+    .test { color: #008000}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-005.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-005.html
new file mode 100644 (file)
index 0000000..4efeb19
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: HSL functions hsl() and hsla()</title>
+<link rel="author" title="Chris Nardi" href="mailto:csnardi1@gmail.com">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#the-hsl-notation">
+<link rel="match" href="greentext-ref.html">
+<meta name="assert" content="legacy hsla() with number and percent alpha, also no comma">
+<style>
+    .test {color: hsla(120 100% 25% / 100%)}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-006-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-006-expected.html
new file mode 100644 (file)
index 0000000..1f6d079
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green text reference</title>
+<style>
+    .test { color: #008000}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-006.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-006.html
new file mode 100644 (file)
index 0000000..e440ebe
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: HSL functions hsl() and hsla()</title>
+<link rel="author" title="Chris Nardi" href="mailto:csnardi1@gmail.com">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#the-hsl-notation">
+<link rel="match" href="greentext-ref.html">
+<meta name="assert" content="legacy hsla() with angle and percent alpha, also no comma">
+<style>
+    .test {color: hsla(120deg 100% 25% / 100%)}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-007-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-007-expected.html
new file mode 100644 (file)
index 0000000..1f6d079
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green text reference</title>
+<style>
+    .test { color: #008000}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-007.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-007.html
new file mode 100644 (file)
index 0000000..ba647ae
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: HSL functions hsl() and hsla()</title>
+<link rel="author" title="Chris Nardi" href="mailto:csnardi1@gmail.com">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#the-hsl-notation">
+<link rel="match" href="greentext-ref.html">
+<meta name="assert" content="legacy hsla() with number and percent alpha, and commas">
+<style>
+    .test {color: hsla(120, 100%, 25%, 100%)}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-008-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-008-expected.html
new file mode 100644 (file)
index 0000000..1f6d079
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green text reference</title>
+<style>
+    .test { color: #008000}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-008.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/hsla-008.html
new file mode 100644 (file)
index 0000000..8f78f88
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: HSL functions hsl() and hsla()</title>
+<link rel="author" title="Chris Nardi" href="mailto:csnardi1@gmail.com">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#the-hsl-notation">
+<link rel="match" href="greentext-ref.html">
+<meta name="assert" content="legacy hsla() with angle and percent alpha, with commas">
+<style>
+    .test {color: hsla(120deg, 100%, 25%, 100%)}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/htaccess b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/htaccess
new file mode 100644 (file)
index 0000000..26cbb02
--- /dev/null
@@ -0,0 +1,23 @@
+# Define some types
+AddType application/xhtml+xml .xht
+AddType text/html .htm
+AddType text/css .css
+AddType image/png .png
+
+# Set the default character set
+AddDefaultCharset utf-8
+
+# Indexing Options
+Options +Indexes
+IndexOptions DescriptionWidth=* NameWidth=* FancyIndexing FoldersFirst ScanHTMLTitles
+IndexIgnore .htaccess *~ .#* #*# CVS README
+ReadmeName README
+
+# Set up the README files to be plain text
+<files README>
+   ForceType text/plain
+   SetHandler default-handler
+</files>
+
+# Add some default descriptions
+AddDescription "Information about the files in this directory" README
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-001-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-001-expected.html
new file mode 100644 (file)
index 0000000..1f6d079
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green text reference</title>
+<style>
+    .test { color: #008000}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-001.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-001.html
new file mode 100644 (file)
index 0000000..70dbd91
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: Specifying Lab and LCH</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#specifying-lab-lch">
+<link rel="match" href="greentext-ref.html">
+<meta name="assert" content="lab() with no alpha">
+<style>
+    .test {color: lab(46.277 -47.562 48.583)} /* green (sRGB #008000) converted to Lab */
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-002-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-002-expected.html
new file mode 100644 (file)
index 0000000..ddfa910
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Black text reference</title>
+<style>
+    .test { color: #000000}
+</style>
+<body>
+    <p class="test">Test passes if this text is black</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-002.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-002.html
new file mode 100644 (file)
index 0000000..1f1b447
--- /dev/null
@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: Specifying Lab and LCH</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#specifying-lab-lch">
+<link rel="match" href="blacktext-ref.html">
+<meta name="assert" content="lab() with no alpha">
+<style>
+    .test { color: red; }
+    .test { color: lab(0 0 0)} /* black (sRGB #000000) converted to Lab */
+</style>
+<body>
+    <p class="test">Test passes if this text is black</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-003-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-003-expected.html
new file mode 100644 (file)
index 0000000..0237a81
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>White text reference</title>
+<style>
+    .test { color: #FFFFFF; background-color: #333; padding: 3px}
+</style>
+<body>
+    <p class="test">Test passes if this text is white</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-003.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-003.html
new file mode 100644 (file)
index 0000000..072dafa
--- /dev/null
@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: Specifying Lab and LCH</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#specifying-lab-lch">
+<link rel="match" href="whitetext-ref.html">
+<meta name="assert" content="lab() with no alpha">
+<style>
+    .test { color: red; background-color: #333; padding: 3px;}
+    .test { color: lab(100 0 0);} /* white (sRGB #FFFFFF) converted to Lab */
+</style>
+<body>
+    <p class="test">Test passes if this text is white</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-004-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-004-expected.html
new file mode 100644 (file)
index 0000000..ddfa910
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Black text reference</title>
+<style>
+    .test { color: #000000}
+</style>
+<body>
+    <p class="test">Test passes if this text is black</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-004.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-004.html
new file mode 100644 (file)
index 0000000..0037a1e
--- /dev/null
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: Specifying Lab and LCH</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#specifying-lab-lch">
+<link rel="match" href="blacktext-ref.html">
+<meta name="assert" content="lab() with no alpha, positive a axis">
+<style>
+    .test { color: red; }
+    .test { color: lab(50 50 0)}
+    .match { color: rgb(75.62%, 30.45%, 47.56%)} /* lab(50,0,0) converted to sRGB */
+</style>
+<body>
+    <p>Test passes if the two lines of filler text are the same color.</p>
+    <p class="test">Filler text. Filler text. Filler text. </p>
+    <p class="match">Filler text. Filler text. Filler text. </p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-005-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-005-expected.html
new file mode 100644 (file)
index 0000000..ddfa910
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Black text reference</title>
+<style>
+    .test { color: #000000}
+</style>
+<body>
+    <p class="test">Test passes if this text is black</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-005.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-005.html
new file mode 100644 (file)
index 0000000..366cd1b
--- /dev/null
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: Specifying Lab and LCH</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#specifying-lab-lch">
+<link rel="match" href="blacktext-ref.html">
+<meta name="assert" content="lab() with no alpha, negative a axis">
+<style>
+    .test { color: red; }
+    .test { color: lab(70 -45 0)}
+    .match { color: rgb(10.79%, 75.55%, 66.40%)} /* lab(70,-45,0) converted to sRGB */
+</style>
+<body>
+    <p>Test passes if the two lines of filler text are the same color.</p>
+    <p class="test">Filler text. Filler text. Filler text. </p>
+    <p class="match">Filler text. Filler text. Filler text. </p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-006-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-006-expected.html
new file mode 100644 (file)
index 0000000..ddfa910
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Black text reference</title>
+<style>
+    .test { color: #000000}
+</style>
+<body>
+    <p class="test">Test passes if this text is black</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-006.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-006.html
new file mode 100644 (file)
index 0000000..079c379
--- /dev/null
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: Specifying Lab and LCH</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#specifying-lab-lch">
+<link rel="match" href="blacktext-ref.html">
+<meta name="assert" content="lab() with no alpha, positive b axis">
+<style>
+    .test { color: red; }
+    .test { color: lab(70 0 70)}
+    .match { color: rgb(76.62%, 66.36%, 5.58%)} /* lab(70,0,70) converted to sRGB */
+</style>
+<body>
+    <p>Test passes if the two lines of filler text are the same color.</p>
+    <p class="test">Filler text. Filler text. Filler text. </p>
+    <p class="match">Filler text. Filler text. Filler text. </p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-007-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-007-expected.html
new file mode 100644 (file)
index 0000000..ddfa910
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Black text reference</title>
+<style>
+    .test { color: #000000}
+</style>
+<body>
+    <p class="test">Test passes if this text is black</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-007.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-007.html
new file mode 100644 (file)
index 0000000..4cdb357
--- /dev/null
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: Specifying Lab and LCH</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#specifying-lab-lch">
+<link rel="match" href="blacktext-ref.html">
+<meta name="assert" content="lab() with no alpha, negative b axis">
+<style>
+    .test { color: red; }
+    .test { color: lab(55 0 -60)}
+    .match { color: rgb(12.81%, 53.10%, 92.76%)} /* lab(55,0,-60) converted to sRGB */
+</style>
+<body>
+    <p>Test passes if the two lines of filler text are the same color.</p>
+    <p class="test">Filler text. Filler text. Filler text. </p>
+    <p class="match">Filler text. Filler text. Filler text. </p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-001-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-001-expected.html
new file mode 100644 (file)
index 0000000..1f6d079
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green text reference</title>
+<style>
+    .test { color: #008000}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-001.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-001.html
new file mode 100644 (file)
index 0000000..966e1fd
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: Specifying Lab and LCH</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#specifying-lab-lch">
+<link rel="match" href="greentext-ref.html">
+<meta name="assert" content="lch() with no alpha">
+<style>
+    .test {color: lab(46.277 -67.989 134.391)} /* green (sRGB #008000) converted to LCH */
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-002-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-002-expected.html
new file mode 100644 (file)
index 0000000..ddfa910
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Black text reference</title>
+<style>
+    .test { color: #000000}
+</style>
+<body>
+    <p class="test">Test passes if this text is black</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-002.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-002.html
new file mode 100644 (file)
index 0000000..d87d042
--- /dev/null
@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: Specifying Lab and LCH</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#specifying-lab-lch">
+<link rel="match" href="blacktext-ref.html">
+<meta name="assert" content="lch() with no alpha">
+<style>
+    .test { color: red; }
+    .test { color: lch(0 0 0)} /* black (sRGB #000000) converted to LCH */
+</style>
+<body>
+    <p class="test">Test passes if this text is black</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-003-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-003-expected.html
new file mode 100644 (file)
index 0000000..0237a81
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>White text reference</title>
+<style>
+    .test { color: #FFFFFF; background-color: #333; padding: 3px}
+</style>
+<body>
+    <p class="test">Test passes if this text is white</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-003.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-003.html
new file mode 100644 (file)
index 0000000..eb8f8a2
--- /dev/null
@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: Specifying Lab and LCH</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#specifying-lab-lch">
+<link rel="match" href="whitetext-ref.html">
+<meta name="assert" content="lch() with no alpha">
+<style>
+    .test { color: red; background-color: #333; padding: 3px;}
+    .test { color: lch(100 0 0);} /* white (sRGB #FFFFFF) converted to LCH */
+</style>
+<body>
+    <p class="test">Test passes if this text is white</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-004-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-004-expected.html
new file mode 100644 (file)
index 0000000..ddfa910
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Black text reference</title>
+<style>
+    .test { color: #000000}
+</style>
+<body>
+    <p class="test">Test passes if this text is black</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-004.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-004.html
new file mode 100644 (file)
index 0000000..46ac7d3
--- /dev/null
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: Specifying Lab and LCH</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#specifying-lab-lch">
+<link rel="match" href="blacktext-ref.html">
+<meta name="assert" content="lch() with no alpha, positive a axis">
+<style>
+    .test { color: red; }
+    .test { color: lch(50 50 0)}
+    .match { color: rgb(75.62%, 30.45%, 47.56%)} /* lch(50,0,0) converted to sRGB */
+</style>
+<body>
+    <p>Test passes if the two lines of filler text are the same color.</p>
+    <p class="test">Filler text. Filler text. Filler text. </p>
+    <p class="match">Filler text. Filler text. Filler text. </p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-005-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-005-expected.html
new file mode 100644 (file)
index 0000000..ddfa910
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Black text reference</title>
+<style>
+    .test { color: #000000}
+</style>
+<body>
+    <p class="test">Test passes if this text is black</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-005.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-005.html
new file mode 100644 (file)
index 0000000..789d4b2
--- /dev/null
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: Specifying Lab and LCH</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#specifying-lab-lch">
+<link rel="match" href="blacktext-ref.html">
+<meta name="assert" content="lch() with no alpha, negative a axis">
+<style>
+    .test { color: red; }
+    .test { color: lab(70 45 180)}
+    .match { color: rgb(10.79%, 75.55%, 66.40%)} /* lch(70,45,180) converted to sRGB */
+</style>
+<body>
+    <p>Test passes if the two lines of filler text are the same color.</p>
+    <p class="test">Filler text. Filler text. Filler text. </p>
+    <p class="match">Filler text. Filler text. Filler text. </p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-006-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-006-expected.html
new file mode 100644 (file)
index 0000000..ddfa910
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Black text reference</title>
+<style>
+    .test { color: #000000}
+</style>
+<body>
+    <p class="test">Test passes if this text is black</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-006.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-006.html
new file mode 100644 (file)
index 0000000..760362c
--- /dev/null
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: Specifying Lab and LCH</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#specifying-lab-lch">
+<link rel="match" href="blacktext-ref.html">
+<meta name="assert" content="lch() with no alpha, positive b axis">
+<style>
+    .test { color: red; }
+    .test { color: lab(70 70 90)}
+    .match { color: rgb(76.62%, 66.36%, 5.58%)} /* lch(70,70,90) converted to sRGB */
+</style>
+<body>
+    <p>Test passes if the two lines of filler text are the same color.</p>
+    <p class="test">Filler text. Filler text. Filler text. </p>
+    <p class="match">Filler text. Filler text. Filler text. </p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-007-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-007-expected.html
new file mode 100644 (file)
index 0000000..ddfa910
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Black text reference</title>
+<style>
+    .test { color: #000000}
+</style>
+<body>
+    <p class="test">Test passes if this text is black</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-007.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-007.html
new file mode 100644 (file)
index 0000000..7b8c41f
--- /dev/null
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: Specifying Lab and LCH</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#specifying-lab-lch">
+<link rel="match" href="blacktext-ref.html">
+<meta name="assert" content="lab() with no alpha, negative b axis">
+<style>
+    .test { color: red; }
+    .test { color: lch(55 60 270)}
+    .match { color: rgb(12.81%, 53.10%, 92.76%)} /* lch(55,60,270) converted to sRGB */
+</style>
+<body>
+    <p>Test passes if the two lines of filler text are the same color.</p>
+    <p class="test">Filler text. Filler text. Filler text. </p>
+    <p class="match">Filler text. Filler text. Filler text. </p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/named-001-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/named-001-expected.html
new file mode 100644 (file)
index 0000000..8c15364
--- /dev/null
@@ -0,0 +1,10 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: Named colors</title>
+<style>
+    .ref {background: #663399; width: 10em; height: 10em;}
+</style>
+<body>
+    <p>Test passes if you see a purple square and no red.</p>
+    <div class="ref"></div>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/named-001.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/named-001.html
new file mode 100644 (file)
index 0000000..61a98dc
--- /dev/null
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: Named colors</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#named-colors">
+<link rel="match" href="rebeccapurple-ref.html">
+<meta name="assert" content="New named color, rebeccapurple">
+<style>
+    .outer {background: red; width: 10em; height: 10em;}
+    .inner {background: rebeccapurple; width: 10em; height: 10em;}
+</style>
+<body>
+    <p>Test passes if you see a purple square and no red.</p>
+    <div class="outer"><div class="inner"></div></div>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-001-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-001-expected.html
new file mode 100644 (file)
index 0000000..1f6d079
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green text reference</title>
+<style>
+    .test { color: #008000}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-001.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-001.html
new file mode 100644 (file)
index 0000000..30603fa
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: RGB functions rgb() and rgba()</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#rgb-functions">
+<link rel="match" href="greentext-ref.html">
+<meta name="assert" content="rgb() with percent and no alpha, also no comma">
+<style>
+    .test {color: rgb(0% 50% 0%)}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-002-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-002-expected.html
new file mode 100644 (file)
index 0000000..1f6d079
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green text reference</title>
+<style>
+    .test { color: #008000}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-002.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-002.html
new file mode 100644 (file)
index 0000000..d9ca685
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: RGB functions rgb() and rgba()</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#rgb-functions">
+<link rel="match" href="greentext-ref.html">
+<meta name="assert" content="rgb() with 8-bit numbers and no alpha, also no comma">
+<style>
+    .test {color: rgb(0 80.0 0)}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-003-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-003-expected.html
new file mode 100644 (file)
index 0000000..1f6d079
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green text reference</title>
+<style>
+    .test { color: #008000}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-003.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-003.html
new file mode 100644 (file)
index 0000000..8355f77
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: RGB functions rgb() and rgba()</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#rgb-functions">
+<link rel="match" href="greentext-ref.html">
+<meta name="assert" content="rgb() with percent and numeric alpha, also no comma">
+<style>
+    .test {color: rgb(0% 50% 0% / 1.0)}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-004-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-004-expected.html
new file mode 100644 (file)
index 0000000..1f6d079
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green text reference</title>
+<style>
+    .test { color: #008000}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-004.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-004.html
new file mode 100644 (file)
index 0000000..7fab317
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: RGB functions rgb() and rgba()</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#rgb-functions">
+<link rel="match" href="greentext-ref.html">
+<meta name="assert" content="rgb() with 8-bit numbers and numeric alpha, also no comma">
+<style>
+    .test {color: rgb(0 80.0 0 / 1)}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-005-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-005-expected.html
new file mode 100644 (file)
index 0000000..1f6d079
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green text reference</title>
+<style>
+    .test { color: #008000}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-005.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-005.html
new file mode 100644 (file)
index 0000000..199eddc
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: RGB functions rgb() and rgba()</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#rgb-functions">
+<link rel="match" href="greentext-ref.html">
+<meta name="assert" content="rgb() with percent and percent alpha, also no comma">
+<style>
+    .test {color: rgb(0% 50% 0% / 100%)}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-006-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-006-expected.html
new file mode 100644 (file)
index 0000000..1f6d079
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green text reference</title>
+<style>
+    .test { color: #008000}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-006.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-006.html
new file mode 100644 (file)
index 0000000..9b4d4fc
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: RGB functions rgb() and rgba()</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#rgb-functions">
+<link rel="match" href="greentext-ref.html">
+<meta name="assert" content="rgb() with 8-bit numbers and percent alpha, also no comma">
+<style>
+    .test {color: rgb(0 80.0 0 / 100%)}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-007-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-007-expected.html
new file mode 100644 (file)
index 0000000..1f6d079
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green text reference</title>
+<style>
+    .test { color: #008000}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-007.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-007.html
new file mode 100644 (file)
index 0000000..a09b713
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: RGB functions rgb() and rgba()</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#rgb-functions">
+<link rel="match" href="greentext-ref.html">
+<meta name="assert" content="legacy rgb() with percent and percent alpha, and commas">
+<style>
+    .test {color: rgb(0%, 50%, 0%, 100%)}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-008-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-008-expected.html
new file mode 100644 (file)
index 0000000..1f6d079
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green text reference</title>
+<style>
+    .test { color: #008000}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-008.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgb-008.html
new file mode 100644 (file)
index 0000000..f8114f0
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: RGB functions rgb() and rgba()</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#rgb-functions">
+<link rel="match" href="greentext-ref.html">
+<meta name="assert" content="legacy rgb() with 8-bit numbers and percent alpha, with commas">
+<style>
+    .test {color: rgb(0, 80.0, 0, 100%)}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-001-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-001-expected.html
new file mode 100644 (file)
index 0000000..1f6d079
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green text reference</title>
+<style>
+    .test { color: #008000}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-001.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-001.html
new file mode 100644 (file)
index 0000000..8fb383f
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: RGB functions rgb() and rgba()</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#rgb-functions">
+<link rel="match" href="greentext-ref.html">
+<meta name="assert" content="legacy rgba() with percent and no alpha, also no comma">
+<style>
+    .test {color: rgba(0% 50% 0%)}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-002-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-002-expected.html
new file mode 100644 (file)
index 0000000..1f6d079
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green text reference</title>
+<style>
+    .test { color: #008000}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-002.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-002.html
new file mode 100644 (file)
index 0000000..3113985
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: RGB functions rgb() and rgba()</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#rgb-functions">
+<link rel="match" href="greentext-ref.html">
+<meta name="assert" content="legacy rgba() with 8-bit numbers and no alpha, also no comma">
+<style>
+    .test {color: rgba(0 80.0 0)}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-003-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-003-expected.html
new file mode 100644 (file)
index 0000000..1f6d079
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green text reference</title>
+<style>
+    .test { color: #008000}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-003.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-003.html
new file mode 100644 (file)
index 0000000..49200d0
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: RGB functions rgb() and rgba()</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#rgb-functions">
+<link rel="match" href="greentext-ref.html">
+<meta name="assert" content="legacy rgba() with percent and numeric alpha, also no comma">
+<style>
+    .test {color: rgba(0% 50% 0% / 1.0)}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-004-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-004-expected.html
new file mode 100644 (file)
index 0000000..1f6d079
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green text reference</title>
+<style>
+    .test { color: #008000}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-004.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-004.html
new file mode 100644 (file)
index 0000000..0d75d4f
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: RGB functions rgb() and rgba()</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#rgb-functions">
+<link rel="match" href="greentext-ref.html">
+<meta name="assert" content="legacy rgba() with 8-bit numbers and numeric alpha, also no comma">
+<style>
+    .test {color: rgba(0 80.0 0 / 1)}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-005-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-005-expected.html
new file mode 100644 (file)
index 0000000..1f6d079
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green text reference</title>
+<style>
+    .test { color: #008000}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-005.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-005.html
new file mode 100644 (file)
index 0000000..1e72b1d
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: RGB functions rgb() and rgba()</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#rgb-functions">
+<link rel="match" href="greentext-ref.html">
+<meta name="assert" content="legacy rgba() with percent and percent alpha, also no comma">
+<style>
+    .test {color: rgba(0% 50% 0% / 100%)}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-006-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-006-expected.html
new file mode 100644 (file)
index 0000000..1f6d079
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green text reference</title>
+<style>
+    .test { color: #008000}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-006.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-006.html
new file mode 100644 (file)
index 0000000..e67956e
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: RGB functions rgb() and rgba()</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#rgb-functions">
+<link rel="match" href="greentext-ref.html">
+<meta name="assert" content="legacy rgba() with 8-bit numbers and percent alpha, also no comma">
+<style>
+    .test {color: rgba(0 80.0 0 / 100%)}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-007-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-007-expected.html
new file mode 100644 (file)
index 0000000..1f6d079
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green text reference</title>
+<style>
+    .test { color: #008000}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-007.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-007.html
new file mode 100644 (file)
index 0000000..5b316a2
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: RGB functions rgb() and rgba()</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#rgb-functions">
+<link rel="match" href="greentext-ref.html">
+<meta name="assert" content="legacy rgba() with percent and percent alpha, and commas">
+<style>
+    .test {color: rgba(0%, 50%, 0%, 100%)}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-008-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-008-expected.html
new file mode 100644 (file)
index 0000000..1f6d079
--- /dev/null
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Green text reference</title>
+<style>
+    .test { color: #008000}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-008.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/rgba-008.html
new file mode 100644 (file)
index 0000000..19bb956
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Color 4: RGB functions rgb() and rgba()</title>
+<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
+<link rel="help" href="https://drafts.csswg.org/css-color-4/#rgb-functions">
+<link rel="match" href="greentext-ref.html">
+<meta name="assert" content="legacy rgba() with 8-bit numbers and percent alpha, with commas">
+<style>
+    .test {color: rgba(0, 80.0, 0, 100%)}
+</style>
+<body>
+    <p class="test">Test passes if this text is green</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/t31-color-text-a-expected.xht b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/t31-color-text-a-expected.xht
new file mode 100644 (file)
index 0000000..f11a57f
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+       <head>
+               <title>CSS Notref Black "should be green"</title>
+               <link rel="author" title="Geoffrey Sneddon" href="mailto:me@gsnedders.com" />
+               <style type="text/css"><![CDATA[
+                       #one { color: #000; color: rgb(0,0,0); color: black; }
+               ]]></style>
+       </head>
+       <body>
+               <p id="one">This text should be green.</p>
+       </body>
+</html>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/t31-color-text-a.xht b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/t31-color-text-a.xht
new file mode 100644 (file)
index 0000000..861d94d
--- /dev/null
@@ -0,0 +1,18 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+       <head>
+               <title>CSS Test: color</title>
+               <link rel="author" title="L. David Baron" href="https://dbaron.org/" />
+               <link rel="author" title="Mozilla Corporation" href="http://mozilla.com/" />
+               <link rel="help" href="http://www.w3.org/TR/css3-color/#foreground" />
+               <link rel="mismatch" href="t31-color-text-a-ref.xht" />
+               <meta name="flags" content="" />
+               <meta name="assert" content="That color sets the color of the text." />
+               <style type="text/css"><![CDATA[
+                       #one { color: green; }
+               ]]></style>
+       </head>
+       <body>
+               <p id="one">This text should be green.</p>
+       </body>
+</html>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/t32-opacity-basic-0.0-a-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/t32-opacity-basic-0.0-a-expected.html
new file mode 100644 (file)
index 0000000..298c489
--- /dev/null
@@ -0,0 +1,6 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Reference</title>
+<body>
+    <p id="one">This should be the only text visible on this page.</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/t32-opacity-basic-0.0-a.xht b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/t32-opacity-basic-0.0-a.xht
new file mode 100644 (file)
index 0000000..637638d
--- /dev/null
@@ -0,0 +1,19 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+       <head>
+               <title>CSS Test: opacity</title>
+               <link rel="author" title="L. David Baron" href="https://dbaron.org/" />
+               <link rel="author" title="Mozilla Corporation" href="http://mozilla.com/" />
+               <link rel="help" href="http://www.w3.org/TR/css3-color/#transparency" />
+               <link rel="match" href="t32-opacity-basic-0.0-a-ref.html" />
+               <meta name="flags" content="" />
+               <meta name="assert" content="Opacity of 0.0 makes box transparent." />
+               <style type="text/css"><![CDATA[
+                       #two { opacity: 0.0; }
+               ]]></style>
+       </head>
+       <body>
+               <p id="one">This should be the only text visible on this page.</p>
+               <p id="two">This text should NOT be visible.</p>
+       </body>
+</html>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/t32-opacity-basic-1.0-a-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/t32-opacity-basic-1.0-a-expected.html
new file mode 100644 (file)
index 0000000..b59c82f
--- /dev/null
@@ -0,0 +1,7 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Reference</title>
+<body>
+    <p id="one">This text should be the same color as the line below.</p>
+    <p id="two">This text should be the same color as the line above.</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/t32-opacity-basic-1.0-a.xht b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/t32-opacity-basic-1.0-a.xht
new file mode 100644 (file)
index 0000000..6d8ea9e
--- /dev/null
@@ -0,0 +1,19 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+       <head>
+               <title>CSS Test: opacity</title>
+               <link rel="author" title="L. David Baron" href="https://dbaron.org/" />
+               <link rel="author" title="Mozilla Corporation" href="http://mozilla.com/" />
+               <link rel="help" href="http://www.w3.org/TR/css3-color/#transparency" />
+               <link rel="match" href="t32-opacity-basic-1.0-a-ref.html" />
+               <meta name="flags" content="" />
+               <meta name="assert" content="Opacity of 1.0 makes box fully opaque." />
+               <style type="text/css"><![CDATA[
+                       #two { opacity: 1.0; }
+               ]]></style>
+       </head>
+       <body>
+               <p id="one">This text should be the same color as the line below.</p>
+               <p id="two">This text should be the same color as the line above.</p>
+       </body>
+</html>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/t32-opacity-clamping-0.0-b-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/t32-opacity-clamping-0.0-b-expected.html
new file mode 100644 (file)
index 0000000..298c489
--- /dev/null
@@ -0,0 +1,6 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Reference</title>
+<body>
+    <p id="one">This should be the only text visible on this page.</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/t32-opacity-clamping-0.0-b.xht b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/t32-opacity-clamping-0.0-b.xht
new file mode 100644 (file)
index 0000000..966f7e0
--- /dev/null
@@ -0,0 +1,27 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+       <head>
+               <title>CSS Test: opacity</title>
+               <link rel="author" title="L. David Baron" href="https://dbaron.org/" />
+               <link rel="author" title="Mozilla Corporation" href="http://mozilla.com/" />
+               <link rel="help" href="http://www.w3.org/TR/css3-color/#transparency" />
+               <link rel="match" href="t32-opacity-basic-0.0-a-ref.html" />
+               <meta name="flags" content="" />
+               <meta name="assert" content="Opacity values less than 0.0 are clamped to 0.0" />
+               <style type="text/css"><![CDATA[
+                       #two { opacity: -0.0; }
+                       #three { opacity: -0.1; }
+                       #four { opacity: -0.9; }
+                       #five { opacity: -30; }
+                       #six { opacity: -7439.79; }
+               ]]></style>
+       </head>
+       <body>
+               <p id="one">This should be the only text visible on this page.</p>
+               <p id="two">This text should NOT be visible.</p>
+               <p id="three">This text should NOT be visible.</p>
+               <p id="four">This text should NOT be visible.</p>
+               <p id="five">This text should NOT be visible.</p>
+               <p id="six">This text should NOT be visible.</p>
+       </body>
+</html>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/t32-opacity-clamping-1.0-b-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/t32-opacity-clamping-1.0-b-expected.html
new file mode 100644 (file)
index 0000000..08854a1
--- /dev/null
@@ -0,0 +1,11 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Reference</title>
+<body>
+    <p id="one">There should be six lines of text on this page, all the same color. [1 of 6]</p>
+    <p id="two">There should be six lines of text on this page, all the same color. [2 of 6]</p>
+    <p id="three">There should be six lines of text on this page, all the same color. [3 of 6]</p>
+    <p id="four">There should be six lines of text on this page, all the same color. [4 of 6]</p>
+    <p id="five">There should be six lines of text on this page, all the same color. [5 of 6]</p>
+    <p id="six">There should be six lines of text on this page, all the same color. [6 of 6]</p>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/t32-opacity-clamping-1.0-b.xht b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/t32-opacity-clamping-1.0-b.xht
new file mode 100644 (file)
index 0000000..31121cb
--- /dev/null
@@ -0,0 +1,30 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+       <head>
+               <title>CSS Test: opacity</title>
+               <link rel="author" title="L. David Baron" href="https://dbaron.org/" />
+               <link rel="author" title="Mozilla Corporation" href="http://mozilla.com/" />
+               <link rel="help" href="http://www.w3.org/TR/css3-color/#transparency" />
+               <link rel="match" href="t32-opacity-clamping-1.0-b-ref.html" />
+               <meta name="flags" content="" />
+               <meta name="assert" content="Opacity values greater than 1.0 are clamped to 1.0" />
+               <style type="text/css"><![CDATA[
+                       /* make sure clamped rather than a parser error */
+                       #two, #three, #four, #five, #six { opacity: 0.0; }
+
+                       #two { opacity: 1.0; }
+                       #three { opacity: 1.1; }
+                       #four { opacity: 1.9; }
+                       #five { opacity: 30; }
+                       #six { opacity: 7439.79; }
+               ]]></style>
+       </head>
+       <body>
+               <p id="one">There should be six lines of text on this page, all the same color. [1 of 6]</p>
+               <p id="two">There should be six lines of text on this page, all the same color. [2 of 6]</p>
+               <p id="three">There should be six lines of text on this page, all the same color. [3 of 6]</p>
+               <p id="four">There should be six lines of text on this page, all the same color. [4 of 6]</p>
+               <p id="five">There should be six lines of text on this page, all the same color. [5 of 6]</p>
+               <p id="six">There should be six lines of text on this page, all the same color. [6 of 6]</p>
+       </body>
+</html>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/t32-opacity-offscreen-b-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/t32-opacity-offscreen-b-expected.html
new file mode 100644 (file)
index 0000000..2a3ae62
--- /dev/null
@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Reference</title>
+<style>
+  div { width: 5em; height: 1em; margin: 2px 0; }
+  .test { background: rgb(153, 153, 255); }
+</style>
+<body>
+    <p>The following five boxes should be the same color:</p>
+
+    <div class="test"></div>
+    <div class="test"></div>
+    <div class="test"></div>
+    <div class="test"></div>
+    <div class="test"></div>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/t32-opacity-offscreen-b.xht b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/t32-opacity-offscreen-b.xht
new file mode 100644 (file)
index 0000000..a373f98
--- /dev/null
@@ -0,0 +1,32 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+       <head>
+               <title>CSS Test: opacity</title>
+               <link rel="author" title="L. David Baron" href="https://dbaron.org/" />
+               <link rel="author" title="Mozilla Corporation" href="http://mozilla.com/" />
+               <link rel="help" href="http://www.w3.org/TR/css3-color/#transparency" />
+               <link rel="match" href="t32-opacity-offscreen-b-ref.html" />
+               <meta name="flags" content="" />
+               <meta name="assert" content="That opacity specifies compositing the contents as a single offscreen buffer." />
+               <style type="text/css"><![CDATA[
+
+               body { background: white; }
+
+               div { width: 5em; height: 1em; }
+               div.color { background: blue; }
+               div.top { margin: 2px 0; opacity: 0.4; }
+
+               div.ref { opacity: 1.0; background: rgb(153, 153, 255); }
+
+               ]]></style>
+       </head>
+       <body>
+               <p>The following five boxes should be the same color:</p>
+
+               <div class="top color"></div>
+               <div class="top color"><div class="color"></div></div>
+               <div class="top"><div class="color"></div></div>
+               <div class="top"><div class="color"><div class="color"></div></div></div>
+               <div class="top ref"></div>
+       </body>
+</html>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/t32-opacity-offscreen-with-alpha-c-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/t32-opacity-offscreen-with-alpha-c-expected.html
new file mode 100644 (file)
index 0000000..923e449
--- /dev/null
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Reference</title>
+<style>
+  div { width: 5em; height: 1em; margin: 2px 0; }
+  .test { background: rgb(204, 204, 255); }
+</style>
+<body>
+    <p>The following four boxes should be the same color:</p>
+
+    <div class="test"></div>
+    <div class="test"></div>
+    <div class="test"></div>
+    <div class="test"></div>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/t32-opacity-offscreen-with-alpha-c.xht b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/t32-opacity-offscreen-with-alpha-c.xht
new file mode 100644 (file)
index 0000000..fdd9ae2
--- /dev/null
@@ -0,0 +1,28 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+       <head>
+               <title>CSS Test: opacity</title>
+               <link rel="author" title="L. David Baron" href="https://dbaron.org/" />
+               <link rel="author" title="Mozilla Corporation" href="http://mozilla.com/" />
+               <link rel="help" href="http://www.w3.org/TR/css3-color/#transparency" />
+               <link rel="match" href="t32-opacity-offscreen-with-alpha-c-ref.html" />
+               <meta name="flags" content="" />
+               <meta name="assert" content="That alpha within the offscreen buffer is composited correctly." />
+               <style type="text/css"><![CDATA[
+
+               body { background: white; }
+
+               div { width: 5em; height: 1em; }
+               div.top { margin: 2px 0; }
+
+               ]]></style>
+       </head>
+       <body>
+               <p>The following four boxes should be the same color:</p>
+
+               <div class="top" style="background: rgb(204, 204, 255)"></div>
+               <div class="top" style="opacity: 0.2; background: rgb(0, 0, 255)"></div>
+               <div class="top" style="opacity: 0.5"><div style="opacity: 0.4; background: rgb(0, 0, 255)"></div></div>
+               <div class="top" style="opacity: 0.4"><div style="background: rgba(0, 0, 255, 0.5)"></div></div>
+       </body>
+</html>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/t41-html4-keywords-a-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/t41-html4-keywords-a-expected.html
new file mode 100644 (file)
index 0000000..4f95dff
--- /dev/null
@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Reference</title>
+<style>
+    html, body { background: #dddddd; color: #000000; }
+    table { border-spacing: 0; padding: 0; border: none; }
+    td { border: none; padding: 0; }
+</style>
+<body>
+    <p>Each row in the following table (except the first and last, to show where the columns are) should have two cells with the same background color.  None of them should match the background of the page.</p>
+
+    <table>
+        <tr><td style="background: black">&nbsp;&nbsp;&nbsp;</td><td style="background: white">&nbsp;&nbsp;&nbsp;</td></tr>
+        <tr><td style="background: #000000" colspan=2>&nbsp;</td></tr>
+        <tr><td style="background: #008000" colspan=2>&nbsp;</td></tr>
+        <tr><td style="background: #C0C0C0" colspan=2>&nbsp;</td></tr>
+        <tr><td style="background: #00FF00" colspan=2>&nbsp;</td></tr>
+        <tr><td style="background: #808080" colspan=2>&nbsp;</td></tr>
+        <tr><td style="background: #808000" colspan=2>&nbsp;</td></tr>
+        <tr><td style="background: #FFFFFF" colspan=2>&nbsp;</td></tr>
+        <tr><td style="background: #FFFF00" colspan=2>&nbsp;</td></tr>
+        <tr><td style="background: #800000" colspan=2>&nbsp;</td></tr>
+        <tr><td style="background: #000080" colspan=2>&nbsp;</td></tr>
+        <tr><td style="background: #FF0000" colspan=2>&nbsp;</td></tr>
+        <tr><td style="background: #0000FF" colspan=2>&nbsp;</td></tr>
+        <tr><td style="background: #800080" colspan=2>&nbsp;</td></tr>
+        <tr><td style="background: #008080" colspan=2>&nbsp;</td></tr>
+        <tr><td style="background: #FF00FF" colspan=2>&nbsp;</td></tr>
+        <tr><td style="background: #00FFFF" colspan=2>&nbsp;</td></tr>
+        <tr><td style="background: white">&nbsp;&nbsp;&nbsp;</td><td style="background: black">&nbsp;&nbsp;&nbsp;</td></tr>
+    </table>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/t41-html4-keywords-a.xht b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/t41-html4-keywords-a.xht
new file mode 100644 (file)
index 0000000..3a3e332
--- /dev/null
@@ -0,0 +1,43 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+       <head>
+               <title>CSS Test: HTML4 color keywords</title>
+               <link rel="author" title="L. David Baron" href="https://dbaron.org/" />
+               <link rel="author" title="Mozilla Corporation" href="http://mozilla.com/" />
+               <link rel="help" href="http://www.w3.org/TR/css3-color/#html4" />
+               <link rel="match" href="t41-html4-keywords-a-ref.html" />
+               <meta name="flags" content="" />
+               <meta name="assert" content="Test that the HTML4 color keywords have the correct values." />
+               <style type="text/css"><![CDATA[
+               html, body { background: #dddddd; color: #000000; }
+               table { border-spacing: 0; padding: 0; border: none; }
+               td { border: none; padding: 0; }
+               ]]></style>
+       </head>
+       <body>
+
+       <p>Each row in the following table (except the first and last, to show where the columns are) should have two cells with the same background color.  None of them should match the background of the page.</p>
+
+       <table>
+               <tr><td style="background: black">&nbsp;&nbsp;&nbsp;</td><td style="background: white">&nbsp;&nbsp;&nbsp;</td></tr>
+               <tr><td style="background: black">&nbsp;&nbsp;&nbsp;</td><td style="background: #000000">&nbsp;&nbsp;&nbsp;</td></tr>
+               <tr><td style="background: green">&nbsp;&nbsp;&nbsp;</td><td style="background: #008000">&nbsp;&nbsp;&nbsp;</td></tr>
+               <tr><td style="background: silver">&nbsp;&nbsp;&nbsp;</td><td style="background: #C0C0C0">&nbsp;&nbsp;&nbsp;</td></tr>
+               <tr><td style="background: lime">&nbsp;&nbsp;&nbsp;</td><td style="background: #00FF00">&nbsp;&nbsp;&nbsp;</td></tr>
+               <tr><td style="background: gray">&nbsp;&nbsp;&nbsp;</td><td style="background: #808080">&nbsp;&nbsp;&nbsp;</td></tr>
+               <tr><td style="background: olive">&nbsp;&nbsp;&nbsp;</td><td style="background: #808000">&nbsp;&nbsp;&nbsp;</td></tr>
+               <tr><td style="background: white">&nbsp;&nbsp;&nbsp;</td><td style="background: #FFFFFF">&nbsp;&nbsp;&nbsp;</td></tr>
+               <tr><td style="background: yellow">&nbsp;&nbsp;&nbsp;</td><td style="background: #FFFF00">&nbsp;&nbsp;&nbsp;</td></tr>
+               <tr><td style="background: maroon">&nbsp;&nbsp;&nbsp;</td><td style="background: #800000">&nbsp;&nbsp;&nbsp;</td></tr>
+               <tr><td style="background: navy">&nbsp;&nbsp;&nbsp;</td><td style="background: #000080">&nbsp;&nbsp;&nbsp;</td></tr>
+               <tr><td style="background: red">&nbsp;&nbsp;&nbsp;</td><td style="background: #FF0000">&nbsp;&nbsp;&nbsp;</td></tr>
+               <tr><td style="background: blue">&nbsp;&nbsp;&nbsp;</td><td style="background: #0000FF">&nbsp;&nbsp;&nbsp;</td></tr>
+               <tr><td style="background: purple">&nbsp;&nbsp;&nbsp;</td><td style="background: #800080">&nbsp;&nbsp;&nbsp;</td></tr>
+               <tr><td style="background: teal">&nbsp;&nbsp;&nbsp;</td><td style="background: #008080">&nbsp;&nbsp;&nbsp;</td></tr>
+               <tr><td style="background: fuchsia">&nbsp;&nbsp;&nbsp;</td><td style="background: #FF00FF">&nbsp;&nbsp;&nbsp;</td></tr>
+               <tr><td style="background: aqua">&nbsp;&nbsp;&nbsp;</td><td style="background: #00FFFF">&nbsp;&nbsp;&nbsp;</td></tr>
+               <tr><td style="background: white">&nbsp;&nbsp;&nbsp;</td><td style="background: black">&nbsp;&nbsp;&nbsp;</td></tr>
+       </table>
+
+       </body>
+</html>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/t421-rgb-clip-outside-gamut-b-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/t421-rgb-clip-outside-gamut-b-expected.html
new file mode 100644 (file)
index 0000000..81bbc51
--- /dev/null
@@ -0,0 +1,42 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Reference</title>
+<style>
+  table { border-spacing: 0 2px; padding: 0; border: none; }
+  td { border: none; padding: 0; height: 1.2em; }
+</style>
+<body>
+  <p><strong>WARNING: This test assumes that the device gamut is sRGB
+  (as it will be for many CRT monitors).</strong></p>
+  <p>Every row in this table should have both columns the same color:</p>
+  <table>
+    <tr>
+      <th style="background:white; color: black">Column 1</th>
+      <th style="background:black; color: white">Column 2</th>
+    </tr>
+    <tr>
+      <td colspan='2' style="background: rgb(0, 255, 0)">&nbsp;</td>
+    </tr>
+    <tr>
+      <td colspan='2' style="background: rgb(0, 0, 255)">&nbsp;</td>
+    </tr>
+    <tr>
+      <td colspan='2' style="background: rgb(0, 255, 0)">&nbsp;</td>
+    </tr>
+    <tr>
+      <td colspan='2' style="background: rgb(0, 255, 0)">&nbsp;</td>
+    </tr>
+    <tr>
+      <td colspan='2' style="background: rgb(0, 255, 0)">&nbsp;</td>
+    </tr>
+    <tr>
+      <td colspan='2' style="background: rgb(0, 255, 0)">&nbsp;</td>
+    </tr>
+    <tr>
+      <td colspan='2' style="background: rgb(50, 0, 255)">&nbsp;</td>
+    </tr>
+    <tr>
+      <td colspan='2' style="background: rgb(0, 50, 255)">&nbsp;</td>
+    </tr>
+  </table>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/t421-rgb-clip-outside-gamut-b.xht b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/t421-rgb-clip-outside-gamut-b.xht
new file mode 100644 (file)
index 0000000..1fd50ff
--- /dev/null
@@ -0,0 +1,65 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+       <head>
+               <title>CSS Test: rgb() clipping outside device gamut</title>
+               <link rel="author" title="L. David Baron" href="https://dbaron.org/" />
+               <link rel="author" title="Mozilla Corporation" href="http://mozilla.com/" />
+               <link rel="help" href="http://www.w3.org/TR/css3-color/#rgb-color" />
+               <link rel="match" href="t421-rgb-clip-outside-gamut-b-ref.html" />
+               <meta name="flags" content="" />
+               <meta name="assert" content="Test clipping of rgb() values outside the device gamut." />
+               <style type="text/css"><![CDATA[
+
+               table { border-spacing: 0 2px; padding: 0; border: none; }
+               td { border: none; padding: 0; height: 1.2em; }
+
+               ]]></style>
+       </head>
+       <body>
+
+       <p><strong>WARNING: This test assumes that the device gamut is sRGB
+       (as it will be for many CRT monitors).</strong></p>
+
+       <p>Every row in this table should have both columns the same color:</p>
+
+       <table>
+               <tr>
+                       <th style="background:white; color: black">Column 1</th>
+                       <th style="background:black; color: white">Column 2</th>
+               </tr>
+               <tr>
+                       <td style="background: rgb(-30, 500, -1)">&nbsp;</td>
+                       <td style="background: rgb(0, 255, 0)">&nbsp;</td>
+               </tr>
+               <tr>
+                       <td style="background: rgb(-260, -254, 300)">&nbsp;</td>
+                       <td style="background: rgb(0, 0, 255)">&nbsp;</td>
+               </tr>
+               <tr>
+                       <td style="background: rgb(-254, 256, 0)">&nbsp;</td>
+                       <td style="background: rgb(0, 255, 0)">&nbsp;</td>
+               </tr>
+               <tr>
+                       <td style="background: rgb(-10%, 200%, -1%)">&nbsp;</td>
+                       <td style="background: rgb(0, 255, 0)">&nbsp;</td>
+               </tr>
+               <tr>
+                       <td style="background: rgb(-110%, 130%, -99%)">&nbsp;</td>
+                       <td style="background: rgb(0, 255, 0)">&nbsp;</td>
+               </tr>
+               <tr>
+                       <td style="background: rgb(-99%, 101%, 0%)">&nbsp;</td>
+                       <td style="background: rgb(0, 255, 0)">&nbsp;</td>
+               </tr>
+               <tr>
+                       <td style="background: rgb(50, -30, 255)">&nbsp;</td>
+                       <td style="background: rgb(50, 0, 255)">&nbsp;</td>
+               </tr>
+               <tr>
+                       <td style="background: rgb(0, 50, 350)">&nbsp;</td>
+                       <td style="background: rgb(0, 50, 255)">&nbsp;</td>
+               </tr>
+       </table>
+
+       </body>
+</html>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/t421-rgb-values-meaning-b-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/t421-rgb-values-meaning-b-expected.html
new file mode 100644 (file)
index 0000000..b468f0e
--- /dev/null
@@ -0,0 +1,1539 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Reference</title>
+<style>
+    table { border-spacing: 0; padding: 0; border: none; }
+    td { border: none; padding: 0; }
+    td { width: 1.2em; height: 1.2em; }
+</style>
+<body>
+    <p>The following table should have four matching rows gradually changing from red at the left to black at the right (plus a checkerboard at both ends to show where the rows are):</p>
+
+    <table border="border">
+        <tr>
+            <td style="background: black">&nbsp;</td>
+            <td style="background: #ff0000">&nbsp;</td>
+            <td style="background: #ee0000">&nbsp;</td>
+            <td style="background: #dd0000">&nbsp;</td>
+            <td style="background: #cc0000">&nbsp;</td>
+            <td style="background: #bb0000">&nbsp;</td>
+            <td style="background: #aa0000">&nbsp;</td>
+            <td style="background: #990000">&nbsp;</td>
+            <td style="background: #880000">&nbsp;</td>
+            <td style="background: #770000">&nbsp;</td>
+            <td style="background: #660000">&nbsp;</td>
+            <td style="background: #550000">&nbsp;</td>
+            <td style="background: #440000">&nbsp;</td>
+            <td style="background: #330000">&nbsp;</td>
+            <td style="background: #220000">&nbsp;</td>
+            <td style="background: #110000">&nbsp;</td>
+            <td style="background: #000000">&nbsp;</td>
+            <td style="background: white">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: white">&nbsp;</td>
+            <td style="background: #ff0000">&nbsp;</td>
+            <td style="background: #ee0000">&nbsp;</td>
+            <td style="background: #dd0000">&nbsp;</td>
+            <td style="background: #cc0000">&nbsp;</td>
+            <td style="background: #bb0000">&nbsp;</td>
+            <td style="background: #aa0000">&nbsp;</td>
+            <td style="background: #990000">&nbsp;</td>
+            <td style="background: #880000">&nbsp;</td>
+            <td style="background: #770000">&nbsp;</td>
+            <td style="background: #660000">&nbsp;</td>
+            <td style="background: #550000">&nbsp;</td>
+            <td style="background: #440000">&nbsp;</td>
+            <td style="background: #330000">&nbsp;</td>
+            <td style="background: #220000">&nbsp;</td>
+            <td style="background: #110000">&nbsp;</td>
+            <td style="background: #000000">&nbsp;</td>
+            <td style="background: black">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: black">&nbsp;</td>
+            <td style="background: #ff0000">&nbsp;</td>
+            <td style="background: #ee0000">&nbsp;</td>
+            <td style="background: #dd0000">&nbsp;</td>
+            <td style="background: #cc0000">&nbsp;</td>
+            <td style="background: #bb0000">&nbsp;</td>
+            <td style="background: #aa0000">&nbsp;</td>
+            <td style="background: #990000">&nbsp;</td>
+            <td style="background: #880000">&nbsp;</td>
+            <td style="background: #770000">&nbsp;</td>
+            <td style="background: #660000">&nbsp;</td>
+            <td style="background: #550000">&nbsp;</td>
+            <td style="background: #440000">&nbsp;</td>
+            <td style="background: #330000">&nbsp;</td>
+            <td style="background: #220000">&nbsp;</td>
+            <td style="background: #110000">&nbsp;</td>
+            <td style="background: #000000">&nbsp;</td>
+            <td style="background: white">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: white">&nbsp;</td>
+            <td style="background: #ff0000">&nbsp;</td>
+            <td style="background: #ee0000">&nbsp;</td>
+            <td style="background: #dd0000">&nbsp;</td>
+            <td style="background: #cc0000">&nbsp;</td>
+            <td style="background: #bb0000">&nbsp;</td>
+            <td style="background: #aa0000">&nbsp;</td>
+            <td style="background: #990000">&nbsp;</td>
+            <td style="background: #880000">&nbsp;</td>
+            <td style="background: #770000">&nbsp;</td>
+            <td style="background: #660000">&nbsp;</td>
+            <td style="background: #550000">&nbsp;</td>
+            <td style="background: #440000">&nbsp;</td>
+            <td style="background: #330000">&nbsp;</td>
+            <td style="background: #220000">&nbsp;</td>
+            <td style="background: #110000">&nbsp;</td>
+            <td style="background: #000000">&nbsp;</td>
+            <td style="background: black">&nbsp;</td>
+        </tr>
+    </table>
+
+    <p>The following table should have four matching rows gradually changing from white at the left to red at the right (plus a checkerboard at both ends to show where the rows are):</p>
+
+    <table border="border">
+        <tr>
+            <td style="background: black">&nbsp;</td>
+            <td style="background: #ffffff">&nbsp;</td>
+            <td style="background: #ffeeee">&nbsp;</td>
+            <td style="background: #ffdddd">&nbsp;</td>
+            <td style="background: #ffcccc">&nbsp;</td>
+            <td style="background: #ffbbbb">&nbsp;</td>
+            <td style="background: #ffaaaa">&nbsp;</td>
+            <td style="background: #ff9999">&nbsp;</td>
+            <td style="background: #ff8888">&nbsp;</td>
+            <td style="background: #ff7777">&nbsp;</td>
+            <td style="background: #ff6666">&nbsp;</td>
+            <td style="background: #ff5555">&nbsp;</td>
+            <td style="background: #ff4444">&nbsp;</td>
+            <td style="background: #ff3333">&nbsp;</td>
+            <td style="background: #ff2222">&nbsp;</td>
+            <td style="background: #ff1111">&nbsp;</td>
+            <td style="background: #ff0000">&nbsp;</td>
+            <td style="background: white">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: white">&nbsp;</td>
+            <td style="background: #ffffff">&nbsp;</td>
+            <td style="background: #ffeeee">&nbsp;</td>
+            <td style="background: #ffdddd">&nbsp;</td>
+            <td style="background: #ffcccc">&nbsp;</td>
+            <td style="background: #ffbbbb">&nbsp;</td>
+            <td style="background: #ffaaaa">&nbsp;</td>
+            <td style="background: #ff9999">&nbsp;</td>
+            <td style="background: #ff8888">&nbsp;</td>
+            <td style="background: #ff7777">&nbsp;</td>
+            <td style="background: #ff6666">&nbsp;</td>
+            <td style="background: #ff5555">&nbsp;</td>
+            <td style="background: #ff4444">&nbsp;</td>
+            <td style="background: #ff3333">&nbsp;</td>
+            <td style="background: #ff2222">&nbsp;</td>
+            <td style="background: #ff1111">&nbsp;</td>
+            <td style="background: #ff0000">&nbsp;</td>
+            <td style="background: black">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: black">&nbsp;</td>
+            <td style="background: #ffffff">&nbsp;</td>
+            <td style="background: #ffeeee">&nbsp;</td>
+            <td style="background: #ffdddd">&nbsp;</td>
+            <td style="background: #ffcccc">&nbsp;</td>
+            <td style="background: #ffbbbb">&nbsp;</td>
+            <td style="background: #ffaaaa">&nbsp;</td>
+            <td style="background: #ff9999">&nbsp;</td>
+            <td style="background: #ff8888">&nbsp;</td>
+            <td style="background: #ff7777">&nbsp;</td>
+            <td style="background: #ff6666">&nbsp;</td>
+            <td style="background: #ff5555">&nbsp;</td>
+            <td style="background: #ff4444">&nbsp;</td>
+            <td style="background: #ff3333">&nbsp;</td>
+            <td style="background: #ff2222">&nbsp;</td>
+            <td style="background: #ff1111">&nbsp;</td>
+            <td style="background: #ff0000">&nbsp;</td>
+            <td style="background: white">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: white">&nbsp;</td>
+            <td style="background: #ffffff">&nbsp;</td>
+            <td style="background: #ffeeee">&nbsp;</td>
+            <td style="background: #ffdddd">&nbsp;</td>
+            <td style="background: #ffcccc">&nbsp;</td>
+            <td style="background: #ffbbbb">&nbsp;</td>
+            <td style="background: #ffaaaa">&nbsp;</td>
+            <td style="background: #ff9999">&nbsp;</td>
+            <td style="background: #ff8888">&nbsp;</td>
+            <td style="background: #ff7777">&nbsp;</td>
+            <td style="background: #ff6666">&nbsp;</td>
+            <td style="background: #ff5555">&nbsp;</td>
+            <td style="background: #ff4444">&nbsp;</td>
+            <td style="background: #ff3333">&nbsp;</td>
+            <td style="background: #ff2222">&nbsp;</td>
+            <td style="background: #ff1111">&nbsp;</td>
+            <td style="background: #ff0000">&nbsp;</td>
+            <td style="background: black">&nbsp;</td>
+        </tr>
+    </table>
+
+    <p>The following table should have four matching rows gradually changing from green at the left to black at the right (plus a checkerboard at both ends to show where the rows are):</p>
+
+    <table border="border">
+        <tr>
+            <td style="background: black">&nbsp;</td>
+            <td style="background: #00ff00">&nbsp;</td>
+            <td style="background: #00ee00">&nbsp;</td>
+            <td style="background: #00dd00">&nbsp;</td>
+            <td style="background: #00cc00">&nbsp;</td>
+            <td style="background: #00bb00">&nbsp;</td>
+            <td style="background: #00aa00">&nbsp;</td>
+            <td style="background: #009900">&nbsp;</td>
+            <td style="background: #008800">&nbsp;</td>
+            <td style="background: #007700">&nbsp;</td>
+            <td style="background: #006600">&nbsp;</td>
+            <td style="background: #005500">&nbsp;</td>
+            <td style="background: #004400">&nbsp;</td>
+            <td style="background: #003300">&nbsp;</td>
+            <td style="background: #002200">&nbsp;</td>
+            <td style="background: #001100">&nbsp;</td>
+            <td style="background: #000000">&nbsp;</td>
+            <td style="background: white">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: white">&nbsp;</td>
+            <td style="background: #00ff00">&nbsp;</td>
+            <td style="background: #00ee00">&nbsp;</td>
+            <td style="background: #00dd00">&nbsp;</td>
+            <td style="background: #00cc00">&nbsp;</td>
+            <td style="background: #00bb00">&nbsp;</td>
+            <td style="background: #00aa00">&nbsp;</td>
+            <td style="background: #009900">&nbsp;</td>
+            <td style="background: #008800">&nbsp;</td>
+            <td style="background: #007700">&nbsp;</td>
+            <td style="background: #006600">&nbsp;</td>
+            <td style="background: #005500">&nbsp;</td>
+            <td style="background: #004400">&nbsp;</td>
+            <td style="background: #003300">&nbsp;</td>
+            <td style="background: #002200">&nbsp;</td>
+            <td style="background: #001100">&nbsp;</td>
+            <td style="background: #000000">&nbsp;</td>
+            <td style="background: black">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: black">&nbsp;</td>
+            <td style="background: #00ff00">&nbsp;</td>
+            <td style="background: #00ee00">&nbsp;</td>
+            <td style="background: #00dd00">&nbsp;</td>
+            <td style="background: #00cc00">&nbsp;</td>
+            <td style="background: #00bb00">&nbsp;</td>
+            <td style="background: #00aa00">&nbsp;</td>
+            <td style="background: #009900">&nbsp;</td>
+            <td style="background: #008800">&nbsp;</td>
+            <td style="background: #007700">&nbsp;</td>
+            <td style="background: #006600">&nbsp;</td>
+            <td style="background: #005500">&nbsp;</td>
+            <td style="background: #004400">&nbsp;</td>
+            <td style="background: #003300">&nbsp;</td>
+            <td style="background: #002200">&nbsp;</td>
+            <td style="background: #001100">&nbsp;</td>
+            <td style="background: #000000">&nbsp;</td>
+            <td style="background: white">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: white">&nbsp;</td>
+            <td style="background: #00ff00">&nbsp;</td>
+            <td style="background: #00ee00">&nbsp;</td>
+            <td style="background: #00dd00">&nbsp;</td>
+            <td style="background: #00cc00">&nbsp;</td>
+            <td style="background: #00bb00">&nbsp;</td>
+            <td style="background: #00aa00">&nbsp;</td>
+            <td style="background: #009900">&nbsp;</td>
+            <td style="background: #008800">&nbsp;</td>
+            <td style="background: #007700">&nbsp;</td>
+            <td style="background: #006600">&nbsp;</td>
+            <td style="background: #005500">&nbsp;</td>
+            <td style="background: #004400">&nbsp;</td>
+            <td style="background: #003300">&nbsp;</td>
+            <td style="background: #002200">&nbsp;</td>
+            <td style="background: #001100">&nbsp;</td>
+            <td style="background: #000000">&nbsp;</td>
+            <td style="background: black">&nbsp;</td>
+        </tr>
+    </table>
+
+    <p>The following table should have four matching rows gradually changing from white at the left to green at the right (plus a checkerboard at both ends to show where the rows are):</p>
+
+    <table border="border">
+        <tr>
+            <td style="background: black">&nbsp;</td>
+            <td style="background: #ffffff">&nbsp;</td>
+            <td style="background: #eeffee">&nbsp;</td>
+            <td style="background: #ddffdd">&nbsp;</td>
+            <td style="background: #ccffcc">&nbsp;</td>
+            <td style="background: #bbffbb">&nbsp;</td>
+            <td style="background: #aaffaa">&nbsp;</td>
+            <td style="background: #99ff99">&nbsp;</td>
+            <td style="background: #88ff88">&nbsp;</td>
+            <td style="background: #77ff77">&nbsp;</td>
+            <td style="background: #66ff66">&nbsp;</td>
+            <td style="background: #55ff55">&nbsp;</td>
+            <td style="background: #44ff44">&nbsp;</td>
+            <td style="background: #33ff33">&nbsp;</td>
+            <td style="background: #22ff22">&nbsp;</td>
+            <td style="background: #11ff11">&nbsp;</td>
+            <td style="background: #00ff00">&nbsp;</td>
+            <td style="background: white">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: white">&nbsp;</td>
+            <td style="background: #ffffff">&nbsp;</td>
+            <td style="background: #eeffee">&nbsp;</td>
+            <td style="background: #ddffdd">&nbsp;</td>
+            <td style="background: #ccffcc">&nbsp;</td>
+            <td style="background: #bbffbb">&nbsp;</td>
+            <td style="background: #aaffaa">&nbsp;</td>
+            <td style="background: #99ff99">&nbsp;</td>
+            <td style="background: #88ff88">&nbsp;</td>
+            <td style="background: #77ff77">&nbsp;</td>
+            <td style="background: #66ff66">&nbsp;</td>
+            <td style="background: #55ff55">&nbsp;</td>
+            <td style="background: #44ff44">&nbsp;</td>
+            <td style="background: #33ff33">&nbsp;</td>
+            <td style="background: #22ff22">&nbsp;</td>
+            <td style="background: #11ff11">&nbsp;</td>
+            <td style="background: #00ff00">&nbsp;</td>
+            <td style="background: black">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: black">&nbsp;</td>
+            <td style="background: #ffffff">&nbsp;</td>
+            <td style="background: #eeffee">&nbsp;</td>
+            <td style="background: #ddffdd">&nbsp;</td>
+            <td style="background: #ccffcc">&nbsp;</td>
+            <td style="background: #bbffbb">&nbsp;</td>
+            <td style="background: #aaffaa">&nbsp;</td>
+            <td style="background: #99ff99">&nbsp;</td>
+            <td style="background: #88ff88">&nbsp;</td>
+            <td style="background: #77ff77">&nbsp;</td>
+            <td style="background: #66ff66">&nbsp;</td>
+            <td style="background: #55ff55">&nbsp;</td>
+            <td style="background: #44ff44">&nbsp;</td>
+            <td style="background: #33ff33">&nbsp;</td>
+            <td style="background: #22ff22">&nbsp;</td>
+            <td style="background: #11ff11">&nbsp;</td>
+            <td style="background: #00ff00">&nbsp;</td>
+            <td style="background: white">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: white">&nbsp;</td>
+            <td style="background: #ffffff">&nbsp;</td>
+            <td style="background: #eeffee">&nbsp;</td>
+            <td style="background: #ddffdd">&nbsp;</td>
+            <td style="background: #ccffcc">&nbsp;</td>
+            <td style="background: #bbffbb">&nbsp;</td>
+            <td style="background: #aaffaa">&nbsp;</td>
+            <td style="background: #99ff99">&nbsp;</td>
+            <td style="background: #88ff88">&nbsp;</td>
+            <td style="background: #77ff77">&nbsp;</td>
+            <td style="background: #66ff66">&nbsp;</td>
+            <td style="background: #55ff55">&nbsp;</td>
+            <td style="background: #44ff44">&nbsp;</td>
+            <td style="background: #33ff33">&nbsp;</td>
+            <td style="background: #22ff22">&nbsp;</td>
+            <td style="background: #11ff11">&nbsp;</td>
+            <td style="background: #00ff00">&nbsp;</td>
+            <td style="background: black">&nbsp;</td>
+        </tr>
+    </table>
+
+    <p>The following table should have four matching rows gradually changing from blue at the left to black at the right (plus a checkerboard at both ends to show where the rows are):</p>
+
+    <table border="border">
+        <tr>
+            <td style="background: black">&nbsp;</td>
+            <td style="background: #0000ff">&nbsp;</td>
+            <td style="background: #0000ee">&nbsp;</td>
+            <td style="background: #0000dd">&nbsp;</td>
+            <td style="background: #0000cc">&nbsp;</td>
+            <td style="background: #0000bb">&nbsp;</td>
+            <td style="background: #0000aa">&nbsp;</td>
+            <td style="background: #000099">&nbsp;</td>
+            <td style="background: #000088">&nbsp;</td>
+            <td style="background: #000077">&nbsp;</td>
+            <td style="background: #000066">&nbsp;</td>
+            <td style="background: #000055">&nbsp;</td>
+            <td style="background: #000044">&nbsp;</td>
+            <td style="background: #000033">&nbsp;</td>
+            <td style="background: #000022">&nbsp;</td>
+            <td style="background: #000011">&nbsp;</td>
+            <td style="background: #000000">&nbsp;</td>
+            <td style="background: white">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: white">&nbsp;</td>
+            <td style="background: #0000ff">&nbsp;</td>
+            <td style="background: #0000ee">&nbsp;</td>
+            <td style="background: #0000dd">&nbsp;</td>
+            <td style="background: #0000cc">&nbsp;</td>
+            <td style="background: #0000bb">&nbsp;</td>
+            <td style="background: #0000aa">&nbsp;</td>
+            <td style="background: #000099">&nbsp;</td>
+            <td style="background: #000088">&nbsp;</td>
+            <td style="background: #000077">&nbsp;</td>
+            <td style="background: #000066">&nbsp;</td>
+            <td style="background: #000055">&nbsp;</td>
+            <td style="background: #000044">&nbsp;</td>
+            <td style="background: #000033">&nbsp;</td>
+            <td style="background: #000022">&nbsp;</td>
+            <td style="background: #000011">&nbsp;</td>
+            <td style="background: #000000">&nbsp;</td>
+            <td style="background: black">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: black">&nbsp;</td>
+            <td style="background: #0000ff">&nbsp;</td>
+            <td style="background: #0000ee">&nbsp;</td>
+            <td style="background: #0000dd">&nbsp;</td>
+            <td style="background: #0000cc">&nbsp;</td>
+            <td style="background: #0000bb">&nbsp;</td>
+            <td style="background: #0000aa">&nbsp;</td>
+            <td style="background: #000099">&nbsp;</td>
+            <td style="background: #000088">&nbsp;</td>
+            <td style="background: #000077">&nbsp;</td>
+            <td style="background: #000066">&nbsp;</td>
+            <td style="background: #000055">&nbsp;</td>
+            <td style="background: #000044">&nbsp;</td>
+            <td style="background: #000033">&nbsp;</td>
+            <td style="background: #000022">&nbsp;</td>
+            <td style="background: #000011">&nbsp;</td>
+            <td style="background: #000000">&nbsp;</td>
+            <td style="background: white">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: white">&nbsp;</td>
+            <td style="background: #0000ff">&nbsp;</td>
+            <td style="background: #0000ee">&nbsp;</td>
+            <td style="background: #0000dd">&nbsp;</td>
+            <td style="background: #0000cc">&nbsp;</td>
+            <td style="background: #0000bb">&nbsp;</td>
+            <td style="background: #0000aa">&nbsp;</td>
+            <td style="background: #000099">&nbsp;</td>
+            <td style="background: #000088">&nbsp;</td>
+            <td style="background: #000077">&nbsp;</td>
+            <td style="background: #000066">&nbsp;</td>
+            <td style="background: #000055">&nbsp;</td>
+            <td style="background: #000044">&nbsp;</td>
+            <td style="background: #000033">&nbsp;</td>
+            <td style="background: #000022">&nbsp;</td>
+            <td style="background: #000011">&nbsp;</td>
+            <td style="background: #000000">&nbsp;</td>
+            <td style="background: black">&nbsp;</td>
+        </tr>
+    </table>
+
+    <p>The following table should have four matching rows gradually changing from white at the left to blue at the right (plus a checkerboard at both ends to show where the rows are):</p>
+
+    <table border="border">
+        <tr>
+            <td style="background: black">&nbsp;</td>
+            <td style="background: #ffffff">&nbsp;</td>
+            <td style="background: #eeeeff">&nbsp;</td>
+            <td style="background: #ddddff">&nbsp;</td>
+            <td style="background: #ccccff">&nbsp;</td>
+            <td style="background: #bbbbff">&nbsp;</td>
+            <td style="background: #aaaaff">&nbsp;</td>
+            <td style="background: #9999ff">&nbsp;</td>
+            <td style="background: #8888ff">&nbsp;</td>
+            <td style="background: #7777ff">&nbsp;</td>
+            <td style="background: #6666ff">&nbsp;</td>
+            <td style="background: #5555ff">&nbsp;</td>
+            <td style="background: #4444ff">&nbsp;</td>
+            <td style="background: #3333ff">&nbsp;</td>
+            <td style="background: #2222ff">&nbsp;</td>
+            <td style="background: #1111ff">&nbsp;</td>
+            <td style="background: #0000ff">&nbsp;</td>
+            <td style="background: white">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: white">&nbsp;</td>
+            <td style="background: #ffffff">&nbsp;</td>
+            <td style="background: #eeeeff">&nbsp;</td>
+            <td style="background: #ddddff">&nbsp;</td>
+            <td style="background: #ccccff">&nbsp;</td>
+            <td style="background: #bbbbff">&nbsp;</td>
+            <td style="background: #aaaaff">&nbsp;</td>
+            <td style="background: #9999ff">&nbsp;</td>
+            <td style="background: #8888ff">&nbsp;</td>
+            <td style="background: #7777ff">&nbsp;</td>
+            <td style="background: #6666ff">&nbsp;</td>
+            <td style="background: #5555ff">&nbsp;</td>
+            <td style="background: #4444ff">&nbsp;</td>
+            <td style="background: #3333ff">&nbsp;</td>
+            <td style="background: #2222ff">&nbsp;</td>
+            <td style="background: #1111ff">&nbsp;</td>
+            <td style="background: #0000ff">&nbsp;</td>
+            <td style="background: black">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: black">&nbsp;</td>
+            <td style="background: #ffffff">&nbsp;</td>
+            <td style="background: #eeeeff">&nbsp;</td>
+            <td style="background: #ddddff">&nbsp;</td>
+            <td style="background: #ccccff">&nbsp;</td>
+            <td style="background: #bbbbff">&nbsp;</td>
+            <td style="background: #aaaaff">&nbsp;</td>
+            <td style="background: #9999ff">&nbsp;</td>
+            <td style="background: #8888ff">&nbsp;</td>
+            <td style="background: #7777ff">&nbsp;</td>
+            <td style="background: #6666ff">&nbsp;</td>
+            <td style="background: #5555ff">&nbsp;</td>
+            <td style="background: #4444ff">&nbsp;</td>
+            <td style="background: #3333ff">&nbsp;</td>
+            <td style="background: #2222ff">&nbsp;</td>
+            <td style="background: #1111ff">&nbsp;</td>
+            <td style="background: #0000ff">&nbsp;</td>
+            <td style="background: white">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: white">&nbsp;</td>
+            <td style="background: #ffffff">&nbsp;</td>
+            <td style="background: #eeeeff">&nbsp;</td>
+            <td style="background: #ddddff">&nbsp;</td>
+            <td style="background: #ccccff">&nbsp;</td>
+            <td style="background: #bbbbff">&nbsp;</td>
+            <td style="background: #aaaaff">&nbsp;</td>
+            <td style="background: #9999ff">&nbsp;</td>
+            <td style="background: #8888ff">&nbsp;</td>
+            <td style="background: #7777ff">&nbsp;</td>
+            <td style="background: #6666ff">&nbsp;</td>
+            <td style="background: #5555ff">&nbsp;</td>
+            <td style="background: #4444ff">&nbsp;</td>
+            <td style="background: #3333ff">&nbsp;</td>
+            <td style="background: #2222ff">&nbsp;</td>
+            <td style="background: #1111ff">&nbsp;</td>
+            <td style="background: #0000ff">&nbsp;</td>
+            <td style="background: black">&nbsp;</td>
+        </tr>
+    </table>
+
+    <p>The following table should have four matching rows gradually changing from yellow at the left to black at the right (plus a checkerboard at both ends to show where the rows are):</p>
+
+    <table border="border">
+        <tr>
+            <td style="background: black">&nbsp;</td>
+            <td style="background: #ffff00">&nbsp;</td>
+            <td style="background: #eeee00">&nbsp;</td>
+            <td style="background: #dddd00">&nbsp;</td>
+            <td style="background: #cccc00">&nbsp;</td>
+            <td style="background: #bbbb00">&nbsp;</td>
+            <td style="background: #aaaa00">&nbsp;</td>
+            <td style="background: #999900">&nbsp;</td>
+            <td style="background: #888800">&nbsp;</td>
+            <td style="background: #777700">&nbsp;</td>
+            <td style="background: #666600">&nbsp;</td>
+            <td style="background: #555500">&nbsp;</td>
+            <td style="background: #444400">&nbsp;</td>
+            <td style="background: #333300">&nbsp;</td>
+            <td style="background: #222200">&nbsp;</td>
+            <td style="background: #111100">&nbsp;</td>
+            <td style="background: #000000">&nbsp;</td>
+            <td style="background: white">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: white">&nbsp;</td>
+            <td style="background: #ffff00">&nbsp;</td>
+            <td style="background: #eeee00">&nbsp;</td>
+            <td style="background: #dddd00">&nbsp;</td>
+            <td style="background: #cccc00">&nbsp;</td>
+            <td style="background: #bbbb00">&nbsp;</td>
+            <td style="background: #aaaa00">&nbsp;</td>
+            <td style="background: #999900">&nbsp;</td>
+            <td style="background: #888800">&nbsp;</td>
+            <td style="background: #777700">&nbsp;</td>
+            <td style="background: #666600">&nbsp;</td>
+            <td style="background: #555500">&nbsp;</td>
+            <td style="background: #444400">&nbsp;</td>
+            <td style="background: #333300">&nbsp;</td>
+            <td style="background: #222200">&nbsp;</td>
+            <td style="background: #111100">&nbsp;</td>
+            <td style="background: #000000">&nbsp;</td>
+            <td style="background: black">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: black">&nbsp;</td>
+            <td style="background: #ffff00">&nbsp;</td>
+            <td style="background: #eeee00">&nbsp;</td>
+            <td style="background: #dddd00">&nbsp;</td>
+            <td style="background: #cccc00">&nbsp;</td>
+            <td style="background: #bbbb00">&nbsp;</td>
+            <td style="background: #aaaa00">&nbsp;</td>
+            <td style="background: #999900">&nbsp;</td>
+            <td style="background: #888800">&nbsp;</td>
+            <td style="background: #777700">&nbsp;</td>
+            <td style="background: #666600">&nbsp;</td>
+            <td style="background: #555500">&nbsp;</td>
+            <td style="background: #444400">&nbsp;</td>
+            <td style="background: #333300">&nbsp;</td>
+            <td style="background: #222200">&nbsp;</td>
+            <td style="background: #111100">&nbsp;</td>
+            <td style="background: #000000">&nbsp;</td>
+            <td style="background: white">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: white">&nbsp;</td>
+            <td style="background: #ffff00">&nbsp;</td>
+            <td style="background: #eeee00">&nbsp;</td>
+            <td style="background: #dddd00">&nbsp;</td>
+            <td style="background: #cccc00">&nbsp;</td>
+            <td style="background: #bbbb00">&nbsp;</td>
+            <td style="background: #aaaa00">&nbsp;</td>
+            <td style="background: #999900">&nbsp;</td>
+            <td style="background: #888800">&nbsp;</td>
+            <td style="background: #777700">&nbsp;</td>
+            <td style="background: #666600">&nbsp;</td>
+            <td style="background: #555500">&nbsp;</td>
+            <td style="background: #444400">&nbsp;</td>
+            <td style="background: #333300">&nbsp;</td>
+            <td style="background: #222200">&nbsp;</td>
+            <td style="background: #111100">&nbsp;</td>
+            <td style="background: #000000">&nbsp;</td>
+            <td style="background: black">&nbsp;</td>
+        </tr>
+    </table>
+
+    <p>The following table should have four matching rows gradually changing from white at the left to yellow at the right (plus a checkerboard at both ends to show where the rows are):</p>
+
+    <table border="border">
+        <tr>
+            <td style="background: black">&nbsp;</td>
+            <td style="background: #ffffff">&nbsp;</td>
+            <td style="background: #ffffee">&nbsp;</td>
+            <td style="background: #ffffdd">&nbsp;</td>
+            <td style="background: #ffffcc">&nbsp;</td>
+            <td style="background: #ffffbb">&nbsp;</td>
+            <td style="background: #ffffaa">&nbsp;</td>
+            <td style="background: #ffff99">&nbsp;</td>
+            <td style="background: #ffff88">&nbsp;</td>
+            <td style="background: #ffff77">&nbsp;</td>
+            <td style="background: #ffff66">&nbsp;</td>
+            <td style="background: #ffff55">&nbsp;</td>
+            <td style="background: #ffff44">&nbsp;</td>
+            <td style="background: #ffff33">&nbsp;</td>
+            <td style="background: #ffff22">&nbsp;</td>
+            <td style="background: #ffff11">&nbsp;</td>
+            <td style="background: #ffff00">&nbsp;</td>
+            <td style="background: white">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: white">&nbsp;</td>
+            <td style="background: #ffffff">&nbsp;</td>
+            <td style="background: #ffffee">&nbsp;</td>
+            <td style="background: #ffffdd">&nbsp;</td>
+            <td style="background: #ffffcc">&nbsp;</td>
+            <td style="background: #ffffbb">&nbsp;</td>
+            <td style="background: #ffffaa">&nbsp;</td>
+            <td style="background: #ffff99">&nbsp;</td>
+            <td style="background: #ffff88">&nbsp;</td>
+            <td style="background: #ffff77">&nbsp;</td>
+            <td style="background: #ffff66">&nbsp;</td>
+            <td style="background: #ffff55">&nbsp;</td>
+            <td style="background: #ffff44">&nbsp;</td>
+            <td style="background: #ffff33">&nbsp;</td>
+            <td style="background: #ffff22">&nbsp;</td>
+            <td style="background: #ffff11">&nbsp;</td>
+            <td style="background: #ffff00">&nbsp;</td>
+            <td style="background: black">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: black">&nbsp;</td>
+            <td style="background: #ffffff">&nbsp;</td>
+            <td style="background: #ffffee">&nbsp;</td>
+            <td style="background: #ffffdd">&nbsp;</td>
+            <td style="background: #ffffcc">&nbsp;</td>
+            <td style="background: #ffffbb">&nbsp;</td>
+            <td style="background: #ffffaa">&nbsp;</td>
+            <td style="background: #ffff99">&nbsp;</td>
+            <td style="background: #ffff88">&nbsp;</td>
+            <td style="background: #ffff77">&nbsp;</td>
+            <td style="background: #ffff66">&nbsp;</td>
+            <td style="background: #ffff55">&nbsp;</td>
+            <td style="background: #ffff44">&nbsp;</td>
+            <td style="background: #ffff33">&nbsp;</td>
+            <td style="background: #ffff22">&nbsp;</td>
+            <td style="background: #ffff11">&nbsp;</td>
+            <td style="background: #ffff00">&nbsp;</td>
+            <td style="background: white">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: white">&nbsp;</td>
+            <td style="background: #ffffff">&nbsp;</td>
+            <td style="background: #ffffee">&nbsp;</td>
+            <td style="background: #ffffdd">&nbsp;</td>
+            <td style="background: #ffffcc">&nbsp;</td>
+            <td style="background: #ffffbb">&nbsp;</td>
+            <td style="background: #ffffaa">&nbsp;</td>
+            <td style="background: #ffff99">&nbsp;</td>
+            <td style="background: #ffff88">&nbsp;</td>
+            <td style="background: #ffff77">&nbsp;</td>
+            <td style="background: #ffff66">&nbsp;</td>
+            <td style="background: #ffff55">&nbsp;</td>
+            <td style="background: #ffff44">&nbsp;</td>
+            <td style="background: #ffff33">&nbsp;</td>
+            <td style="background: #ffff22">&nbsp;</td>
+            <td style="background: #ffff11">&nbsp;</td>
+            <td style="background: #ffff00">&nbsp;</td>
+            <td style="background: black">&nbsp;</td>
+        </tr>
+    </table>
+
+    <p>The following table should have four matching rows gradually changing from fuchsia at the left to black at the right (plus a checkerboard at both ends to show where the rows are):</p>
+
+    <table border="border">
+        <tr>
+            <td style="background: black">&nbsp;</td>
+            <td style="background: #ff00ff">&nbsp;</td>
+            <td style="background: #ee00ee">&nbsp;</td>
+            <td style="background: #dd00dd">&nbsp;</td>
+            <td style="background: #cc00cc">&nbsp;</td>
+            <td style="background: #bb00bb">&nbsp;</td>
+            <td style="background: #aa00aa">&nbsp;</td>
+            <td style="background: #990099">&nbsp;</td>
+            <td style="background: #880088">&nbsp;</td>
+            <td style="background: #770077">&nbsp;</td>
+            <td style="background: #660066">&nbsp;</td>
+            <td style="background: #550055">&nbsp;</td>
+            <td style="background: #440044">&nbsp;</td>
+            <td style="background: #330033">&nbsp;</td>
+            <td style="background: #220022">&nbsp;</td>
+            <td style="background: #110011">&nbsp;</td>
+            <td style="background: #000000">&nbsp;</td>
+            <td style="background: white">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: white">&nbsp;</td>
+            <td style="background: #ff00ff">&nbsp;</td>
+            <td style="background: #ee00ee">&nbsp;</td>
+            <td style="background: #dd00dd">&nbsp;</td>
+            <td style="background: #cc00cc">&nbsp;</td>
+            <td style="background: #bb00bb">&nbsp;</td>
+            <td style="background: #aa00aa">&nbsp;</td>
+            <td style="background: #990099">&nbsp;</td>
+            <td style="background: #880088">&nbsp;</td>
+            <td style="background: #770077">&nbsp;</td>
+            <td style="background: #660066">&nbsp;</td>
+            <td style="background: #550055">&nbsp;</td>
+            <td style="background: #440044">&nbsp;</td>
+            <td style="background: #330033">&nbsp;</td>
+            <td style="background: #220022">&nbsp;</td>
+            <td style="background: #110011">&nbsp;</td>
+            <td style="background: #000000">&nbsp;</td>
+            <td style="background: black">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: black">&nbsp;</td>
+            <td style="background: #ff00ff">&nbsp;</td>
+            <td style="background: #ee00ee">&nbsp;</td>
+            <td style="background: #dd00dd">&nbsp;</td>
+            <td style="background: #cc00cc">&nbsp;</td>
+            <td style="background: #bb00bb">&nbsp;</td>
+            <td style="background: #aa00aa">&nbsp;</td>
+            <td style="background: #990099">&nbsp;</td>
+            <td style="background: #880088">&nbsp;</td>
+            <td style="background: #770077">&nbsp;</td>
+            <td style="background: #660066">&nbsp;</td>
+            <td style="background: #550055">&nbsp;</td>
+            <td style="background: #440044">&nbsp;</td>
+            <td style="background: #330033">&nbsp;</td>
+            <td style="background: #220022">&nbsp;</td>
+            <td style="background: #110011">&nbsp;</td>
+            <td style="background: #000000">&nbsp;</td>
+            <td style="background: white">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: white">&nbsp;</td>
+            <td style="background: #ff00ff">&nbsp;</td>
+            <td style="background: #ee00ee">&nbsp;</td>
+            <td style="background: #dd00dd">&nbsp;</td>
+            <td style="background: #cc00cc">&nbsp;</td>
+            <td style="background: #bb00bb">&nbsp;</td>
+            <td style="background: #aa00aa">&nbsp;</td>
+            <td style="background: #990099">&nbsp;</td>
+            <td style="background: #880088">&nbsp;</td>
+            <td style="background: #770077">&nbsp;</td>
+            <td style="background: #660066">&nbsp;</td>
+            <td style="background: #550055">&nbsp;</td>
+            <td style="background: #440044">&nbsp;</td>
+            <td style="background: #330033">&nbsp;</td>
+            <td style="background: #220022">&nbsp;</td>
+            <td style="background: #110011">&nbsp;</td>
+            <td style="background: #000000">&nbsp;</td>
+            <td style="background: black">&nbsp;</td>
+        </tr>
+    </table>
+
+    <p>The following table should have four matching rows gradually changing from white at the left to fuchsia at the right (plus a checkerboard at both ends to show where the rows are):</p>
+
+    <table border="border">
+        <tr>
+            <td style="background: black">&nbsp;</td>
+            <td style="background: #ffffff">&nbsp;</td>
+            <td style="background: #ffeeff">&nbsp;</td>
+            <td style="background: #ffddff">&nbsp;</td>
+            <td style="background: #ffccff">&nbsp;</td>
+            <td style="background: #ffbbff">&nbsp;</td>
+            <td style="background: #ffaaff">&nbsp;</td>
+            <td style="background: #ff99ff">&nbsp;</td>
+            <td style="background: #ff88ff">&nbsp;</td>
+            <td style="background: #ff77ff">&nbsp;</td>
+            <td style="background: #ff66ff">&nbsp;</td>
+            <td style="background: #ff55ff">&nbsp;</td>
+            <td style="background: #ff44ff">&nbsp;</td>
+            <td style="background: #ff33ff">&nbsp;</td>
+            <td style="background: #ff22ff">&nbsp;</td>
+            <td style="background: #ff11ff">&nbsp;</td>
+            <td style="background: #ff00ff">&nbsp;</td>
+            <td style="background: white">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: white">&nbsp;</td>
+            <td style="background: #ffffff">&nbsp;</td>
+            <td style="background: #ffeeff">&nbsp;</td>
+            <td style="background: #ffddff">&nbsp;</td>
+            <td style="background: #ffccff">&nbsp;</td>
+            <td style="background: #ffbbff">&nbsp;</td>
+            <td style="background: #ffaaff">&nbsp;</td>
+            <td style="background: #ff99ff">&nbsp;</td>
+            <td style="background: #ff88ff">&nbsp;</td>
+            <td style="background: #ff77ff">&nbsp;</td>
+            <td style="background: #ff66ff">&nbsp;</td>
+            <td style="background: #ff55ff">&nbsp;</td>
+            <td style="background: #ff44ff">&nbsp;</td>
+            <td style="background: #ff33ff">&nbsp;</td>
+            <td style="background: #ff22ff">&nbsp;</td>
+            <td style="background: #ff11ff">&nbsp;</td>
+            <td style="background: #ff00ff">&nbsp;</td>
+            <td style="background: black">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: black">&nbsp;</td>
+            <td style="background: #ffffff">&nbsp;</td>
+            <td style="background: #ffeeff">&nbsp;</td>
+            <td style="background: #ffddff">&nbsp;</td>
+            <td style="background: #ffccff">&nbsp;</td>
+            <td style="background: #ffbbff">&nbsp;</td>
+            <td style="background: #ffaaff">&nbsp;</td>
+            <td style="background: #ff99ff">&nbsp;</td>
+            <td style="background: #ff88ff">&nbsp;</td>
+            <td style="background: #ff77ff">&nbsp;</td>
+            <td style="background: #ff66ff">&nbsp;</td>
+            <td style="background: #ff55ff">&nbsp;</td>
+            <td style="background: #ff44ff">&nbsp;</td>
+            <td style="background: #ff33ff">&nbsp;</td>
+            <td style="background: #ff22ff">&nbsp;</td>
+            <td style="background: #ff11ff">&nbsp;</td>
+            <td style="background: #ff00ff">&nbsp;</td>
+            <td style="background: white">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: white">&nbsp;</td>
+            <td style="background: #ffffff">&nbsp;</td>
+            <td style="background: #ffeeff">&nbsp;</td>
+            <td style="background: #ffddff">&nbsp;</td>
+            <td style="background: #ffccff">&nbsp;</td>
+            <td style="background: #ffbbff">&nbsp;</td>
+            <td style="background: #ffaaff">&nbsp;</td>
+            <td style="background: #ff99ff">&nbsp;</td>
+            <td style="background: #ff88ff">&nbsp;</td>
+            <td style="background: #ff77ff">&nbsp;</td>
+            <td style="background: #ff66ff">&nbsp;</td>
+            <td style="background: #ff55ff">&nbsp;</td>
+            <td style="background: #ff44ff">&nbsp;</td>
+            <td style="background: #ff33ff">&nbsp;</td>
+            <td style="background: #ff22ff">&nbsp;</td>
+            <td style="background: #ff11ff">&nbsp;</td>
+            <td style="background: #ff00ff">&nbsp;</td>
+            <td style="background: black">&nbsp;</td>
+        </tr>
+    </table>
+
+    <p>The following table should have four matching rows gradually changing from aqua at the left to black at the right (plus a checkerboard at both ends to show where the rows are):</p>
+
+    <table border="border">
+        <tr>
+            <td style="background: black">&nbsp;</td>
+            <td style="background: #00ffff">&nbsp;</td>
+            <td style="background: #00eeee">&nbsp;</td>
+            <td style="background: #00dddd">&nbsp;</td>
+            <td style="background: #00cccc">&nbsp;</td>
+            <td style="background: #00bbbb">&nbsp;</td>
+            <td style="background: #00aaaa">&nbsp;</td>
+            <td style="background: #009999">&nbsp;</td>
+            <td style="background: #008888">&nbsp;</td>
+            <td style="background: #007777">&nbsp;</td>
+            <td style="background: #006666">&nbsp;</td>
+            <td style="background: #005555">&nbsp;</td>
+            <td style="background: #004444">&nbsp;</td>
+            <td style="background: #003333">&nbsp;</td>
+            <td style="background: #002222">&nbsp;</td>
+            <td style="background: #001111">&nbsp;</td>
+            <td style="background: #000000">&nbsp;</td>
+            <td style="background: white">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: white">&nbsp;</td>
+            <td style="background: #00ffff">&nbsp;</td>
+            <td style="background: #00eeee">&nbsp;</td>
+            <td style="background: #00dddd">&nbsp;</td>
+            <td style="background: #00cccc">&nbsp;</td>
+            <td style="background: #00bbbb">&nbsp;</td>
+            <td style="background: #00aaaa">&nbsp;</td>
+            <td style="background: #009999">&nbsp;</td>
+            <td style="background: #008888">&nbsp;</td>
+            <td style="background: #007777">&nbsp;</td>
+            <td style="background: #006666">&nbsp;</td>
+            <td style="background: #005555">&nbsp;</td>
+            <td style="background: #004444">&nbsp;</td>
+            <td style="background: #003333">&nbsp;</td>
+            <td style="background: #002222">&nbsp;</td>
+            <td style="background: #001111">&nbsp;</td>
+            <td style="background: #000000">&nbsp;</td>
+            <td style="background: black">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: black">&nbsp;</td>
+            <td style="background: #00ffff">&nbsp;</td>
+            <td style="background: #00eeee">&nbsp;</td>
+            <td style="background: #00dddd">&nbsp;</td>
+            <td style="background: #00cccc">&nbsp;</td>
+            <td style="background: #00bbbb">&nbsp;</td>
+            <td style="background: #00aaaa">&nbsp;</td>
+            <td style="background: #009999">&nbsp;</td>
+            <td style="background: #008888">&nbsp;</td>
+            <td style="background: #007777">&nbsp;</td>
+            <td style="background: #006666">&nbsp;</td>
+            <td style="background: #005555">&nbsp;</td>
+            <td style="background: #004444">&nbsp;</td>
+            <td style="background: #003333">&nbsp;</td>
+            <td style="background: #002222">&nbsp;</td>
+            <td style="background: #001111">&nbsp;</td>
+            <td style="background: #000000">&nbsp;</td>
+            <td style="background: white">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: white">&nbsp;</td>
+            <td style="background: #00ffff">&nbsp;</td>
+            <td style="background: #00eeee">&nbsp;</td>
+            <td style="background: #00dddd">&nbsp;</td>
+            <td style="background: #00cccc">&nbsp;</td>
+            <td style="background: #00bbbb">&nbsp;</td>
+            <td style="background: #00aaaa">&nbsp;</td>
+            <td style="background: #009999">&nbsp;</td>
+            <td style="background: #008888">&nbsp;</td>
+            <td style="background: #007777">&nbsp;</td>
+            <td style="background: #006666">&nbsp;</td>
+            <td style="background: #005555">&nbsp;</td>
+            <td style="background: #004444">&nbsp;</td>
+            <td style="background: #003333">&nbsp;</td>
+            <td style="background: #002222">&nbsp;</td>
+            <td style="background: #001111">&nbsp;</td>
+            <td style="background: #000000">&nbsp;</td>
+            <td style="background: black">&nbsp;</td>
+        </tr>
+    </table>
+
+    <p>The following table should have four matching rows gradually changing from white at the left to aqua at the right (plus a checkerboard at both ends to show where the rows are):</p>
+
+    <table border="border">
+        <tr>
+            <td style="background: black">&nbsp;</td>
+            <td style="background: #ffffff">&nbsp;</td>
+            <td style="background: #eeffff">&nbsp;</td>
+            <td style="background: #ddffff">&nbsp;</td>
+            <td style="background: #ccffff">&nbsp;</td>
+            <td style="background: #bbffff">&nbsp;</td>
+            <td style="background: #aaffff">&nbsp;</td>
+            <td style="background: #99ffff">&nbsp;</td>
+            <td style="background: #88ffff">&nbsp;</td>
+            <td style="background: #77ffff">&nbsp;</td>
+            <td style="background: #66ffff">&nbsp;</td>
+            <td style="background: #55ffff">&nbsp;</td>
+            <td style="background: #44ffff">&nbsp;</td>
+            <td style="background: #33ffff">&nbsp;</td>
+            <td style="background: #22ffff">&nbsp;</td>
+            <td style="background: #11ffff">&nbsp;</td>
+            <td style="background: #00ffff">&nbsp;</td>
+            <td style="background: white">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: white">&nbsp;</td>
+            <td style="background: #ffffff">&nbsp;</td>
+            <td style="background: #eeffff">&nbsp;</td>
+            <td style="background: #ddffff">&nbsp;</td>
+            <td style="background: #ccffff">&nbsp;</td>
+            <td style="background: #bbffff">&nbsp;</td>
+            <td style="background: #aaffff">&nbsp;</td>
+            <td style="background: #99ffff">&nbsp;</td>
+            <td style="background: #88ffff">&nbsp;</td>
+            <td style="background: #77ffff">&nbsp;</td>
+            <td style="background: #66ffff">&nbsp;</td>
+            <td style="background: #55ffff">&nbsp;</td>
+            <td style="background: #44ffff">&nbsp;</td>
+            <td style="background: #33ffff">&nbsp;</td>
+            <td style="background: #22ffff">&nbsp;</td>
+            <td style="background: #11ffff">&nbsp;</td>
+            <td style="background: #00ffff">&nbsp;</td>
+            <td style="background: black">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: black">&nbsp;</td>
+            <td style="background: #ffffff">&nbsp;</td>
+            <td style="background: #eeffff">&nbsp;</td>
+            <td style="background: #ddffff">&nbsp;</td>
+            <td style="background: #ccffff">&nbsp;</td>
+            <td style="background: #bbffff">&nbsp;</td>
+            <td style="background: #aaffff">&nbsp;</td>
+            <td style="background: #99ffff">&nbsp;</td>
+            <td style="background: #88ffff">&nbsp;</td>
+            <td style="background: #77ffff">&nbsp;</td>
+            <td style="background: #66ffff">&nbsp;</td>
+            <td style="background: #55ffff">&nbsp;</td>
+            <td style="background: #44ffff">&nbsp;</td>
+            <td style="background: #33ffff">&nbsp;</td>
+            <td style="background: #22ffff">&nbsp;</td>
+            <td style="background: #11ffff">&nbsp;</td>
+            <td style="background: #00ffff">&nbsp;</td>
+            <td style="background: white">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: white">&nbsp;</td>
+            <td style="background: #ffffff">&nbsp;</td>
+            <td style="background: #eeffff">&nbsp;</td>
+            <td style="background: #ddffff">&nbsp;</td>
+            <td style="background: #ccffff">&nbsp;</td>
+            <td style="background: #bbffff">&nbsp;</td>
+            <td style="background: #aaffff">&nbsp;</td>
+            <td style="background: #99ffff">&nbsp;</td>
+            <td style="background: #88ffff">&nbsp;</td>
+            <td style="background: #77ffff">&nbsp;</td>
+            <td style="background: #66ffff">&nbsp;</td>
+            <td style="background: #55ffff">&nbsp;</td>
+            <td style="background: #44ffff">&nbsp;</td>
+            <td style="background: #33ffff">&nbsp;</td>
+            <td style="background: #22ffff">&nbsp;</td>
+            <td style="background: #11ffff">&nbsp;</td>
+            <td style="background: #00ffff">&nbsp;</td>
+            <td style="background: black">&nbsp;</td>
+        </tr>
+    </table>
+
+    <p>The following table should have four matching rows gradually changing from red at the left to green at the right (plus a checkerboard at both ends to show where the rows are):</p>
+
+    <table border="border">
+        <tr>
+            <td style="background: black">&nbsp;</td>
+            <td style="background: #ff0000">&nbsp;</td>
+            <td style="background: #ee1100">&nbsp;</td>
+            <td style="background: #dd2200">&nbsp;</td>
+            <td style="background: #cc3300">&nbsp;</td>
+            <td style="background: #bb4400">&nbsp;</td>
+            <td style="background: #aa5500">&nbsp;</td>
+            <td style="background: #996600">&nbsp;</td>
+            <td style="background: #887700">&nbsp;</td>
+            <td style="background: #778800">&nbsp;</td>
+            <td style="background: #669900">&nbsp;</td>
+            <td style="background: #55aa00">&nbsp;</td>
+            <td style="background: #44bb00">&nbsp;</td>
+            <td style="background: #33cc00">&nbsp;</td>
+            <td style="background: #22dd00">&nbsp;</td>
+            <td style="background: #11ee00">&nbsp;</td>
+            <td style="background: #00ff00">&nbsp;</td>
+            <td style="background: white">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: white">&nbsp;</td>
+            <td style="background: #ff0000">&nbsp;</td>
+            <td style="background: #ee1100">&nbsp;</td>
+            <td style="background: #dd2200">&nbsp;</td>
+            <td style="background: #cc3300">&nbsp;</td>
+            <td style="background: #bb4400">&nbsp;</td>
+            <td style="background: #aa5500">&nbsp;</td>
+            <td style="background: #996600">&nbsp;</td>
+            <td style="background: #887700">&nbsp;</td>
+            <td style="background: #778800">&nbsp;</td>
+            <td style="background: #669900">&nbsp;</td>
+            <td style="background: #55aa00">&nbsp;</td>
+            <td style="background: #44bb00">&nbsp;</td>
+            <td style="background: #33cc00">&nbsp;</td>
+            <td style="background: #22dd00">&nbsp;</td>
+            <td style="background: #11ee00">&nbsp;</td>
+            <td style="background: #00ff00">&nbsp;</td>
+            <td style="background: black">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: black">&nbsp;</td>
+            <td style="background: #ff0000">&nbsp;</td>
+            <td style="background: #ee1100">&nbsp;</td>
+            <td style="background: #dd2200">&nbsp;</td>
+            <td style="background: #cc3300">&nbsp;</td>
+            <td style="background: #bb4400">&nbsp;</td>
+            <td style="background: #aa5500">&nbsp;</td>
+            <td style="background: #996600">&nbsp;</td>
+            <td style="background: #887700">&nbsp;</td>
+            <td style="background: #778800">&nbsp;</td>
+            <td style="background: #669900">&nbsp;</td>
+            <td style="background: #55aa00">&nbsp;</td>
+            <td style="background: #44bb00">&nbsp;</td>
+            <td style="background: #33cc00">&nbsp;</td>
+            <td style="background: #22dd00">&nbsp;</td>
+            <td style="background: #11ee00">&nbsp;</td>
+            <td style="background: #00ff00">&nbsp;</td>
+            <td style="background: white">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: white">&nbsp;</td>
+            <td style="background: #ff0000">&nbsp;</td>
+            <td style="background: #ee1100">&nbsp;</td>
+            <td style="background: #dd2200">&nbsp;</td>
+            <td style="background: #cc3300">&nbsp;</td>
+            <td style="background: #bb4400">&nbsp;</td>
+            <td style="background: #aa5500">&nbsp;</td>
+            <td style="background: #996600">&nbsp;</td>
+            <td style="background: #887700">&nbsp;</td>
+            <td style="background: #778800">&nbsp;</td>
+            <td style="background: #669900">&nbsp;</td>
+            <td style="background: #55aa00">&nbsp;</td>
+            <td style="background: #44bb00">&nbsp;</td>
+            <td style="background: #33cc00">&nbsp;</td>
+            <td style="background: #22dd00">&nbsp;</td>
+            <td style="background: #11ee00">&nbsp;</td>
+            <td style="background: #00ff00">&nbsp;</td>
+            <td style="background: black">&nbsp;</td>
+        </tr>
+    </table>
+
+    <p>The following table should have four matching rows gradually changing from green at the left to blue at the right (plus a checkerboard at both ends to show where the rows are):</p>
+
+    <table border="border">
+        <tr>
+            <td style="background: black">&nbsp;</td>
+            <td style="background: #00ff00">&nbsp;</td>
+            <td style="background: #00ee11">&nbsp;</td>
+            <td style="background: #00dd22">&nbsp;</td>
+            <td style="background: #00cc33">&nbsp;</td>
+            <td style="background: #00bb44">&nbsp;</td>
+            <td style="background: #00aa55">&nbsp;</td>
+            <td style="background: #009966">&nbsp;</td>
+            <td style="background: #008877">&nbsp;</td>
+            <td style="background: #007788">&nbsp;</td>
+            <td style="background: #006699">&nbsp;</td>
+            <td style="background: #0055aa">&nbsp;</td>
+            <td style="background: #0044bb">&nbsp;</td>
+            <td style="background: #0033cc">&nbsp;</td>
+            <td style="background: #0022dd">&nbsp;</td>
+            <td style="background: #0011ee">&nbsp;</td>
+            <td style="background: #0000ff">&nbsp;</td>
+            <td style="background: white">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: white">&nbsp;</td>
+            <td style="background: #00ff00">&nbsp;</td>
+            <td style="background: #00ee11">&nbsp;</td>
+            <td style="background: #00dd22">&nbsp;</td>
+            <td style="background: #00cc33">&nbsp;</td>
+            <td style="background: #00bb44">&nbsp;</td>
+            <td style="background: #00aa55">&nbsp;</td>
+            <td style="background: #009966">&nbsp;</td>
+            <td style="background: #008877">&nbsp;</td>
+            <td style="background: #007788">&nbsp;</td>
+            <td style="background: #006699">&nbsp;</td>
+            <td style="background: #0055aa">&nbsp;</td>
+            <td style="background: #0044bb">&nbsp;</td>
+            <td style="background: #0033cc">&nbsp;</td>
+            <td style="background: #0022dd">&nbsp;</td>
+            <td style="background: #0011ee">&nbsp;</td>
+            <td style="background: #0000ff">&nbsp;</td>
+            <td style="background: black">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: black">&nbsp;</td>
+            <td style="background: #00ff00">&nbsp;</td>
+            <td style="background: #00ee11">&nbsp;</td>
+            <td style="background: #00dd22">&nbsp;</td>
+            <td style="background: #00cc33">&nbsp;</td>
+            <td style="background: #00bb44">&nbsp;</td>
+            <td style="background: #00aa55">&nbsp;</td>
+            <td style="background: #009966">&nbsp;</td>
+            <td style="background: #008877">&nbsp;</td>
+            <td style="background: #007788">&nbsp;</td>
+            <td style="background: #006699">&nbsp;</td>
+            <td style="background: #0055aa">&nbsp;</td>
+            <td style="background: #0044bb">&nbsp;</td>
+            <td style="background: #0033cc">&nbsp;</td>
+            <td style="background: #0022dd">&nbsp;</td>
+            <td style="background: #0011ee">&nbsp;</td>
+            <td style="background: #0000ff">&nbsp;</td>
+            <td style="background: white">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: white">&nbsp;</td>
+            <td style="background: #00ff00">&nbsp;</td>
+            <td style="background: #00ee11">&nbsp;</td>
+            <td style="background: #00dd22">&nbsp;</td>
+            <td style="background: #00cc33">&nbsp;</td>
+            <td style="background: #00bb44">&nbsp;</td>
+            <td style="background: #00aa55">&nbsp;</td>
+            <td style="background: #009966">&nbsp;</td>
+            <td style="background: #008877">&nbsp;</td>
+            <td style="background: #007788">&nbsp;</td>
+            <td style="background: #006699">&nbsp;</td>
+            <td style="background: #0055aa">&nbsp;</td>
+            <td style="background: #0044bb">&nbsp;</td>
+            <td style="background: #0033cc">&nbsp;</td>
+            <td style="background: #0022dd">&nbsp;</td>
+            <td style="background: #0011ee">&nbsp;</td>
+            <td style="background: #0000ff">&nbsp;</td>
+            <td style="background: black">&nbsp;</td>
+        </tr>
+    </table>
+
+    <p>The following table should have four matching rows gradually changing from blue at the left to red at the right (plus a checkerboard at both ends to show where the rows are):</p>
+
+    <table border="border">
+        <tr>
+            <td style="background: black">&nbsp;</td>
+            <td style="background: #00ff00">&nbsp;</td>
+            <td style="background: #00ee11">&nbsp;</td>
+            <td style="background: #00dd22">&nbsp;</td>
+            <td style="background: #00cc33">&nbsp;</td>
+            <td style="background: #00bb44">&nbsp;</td>
+            <td style="background: #00aa55">&nbsp;</td>
+            <td style="background: #009966">&nbsp;</td>
+            <td style="background: #008877">&nbsp;</td>
+            <td style="background: #007788">&nbsp;</td>
+            <td style="background: #006699">&nbsp;</td>
+            <td style="background: #0055aa">&nbsp;</td>
+            <td style="background: #0044bb">&nbsp;</td>
+            <td style="background: #0033cc">&nbsp;</td>
+            <td style="background: #0022dd">&nbsp;</td>
+            <td style="background: #0011ee">&nbsp;</td>
+            <td style="background: #0000ff">&nbsp;</td>
+            <td style="background: white">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: white">&nbsp;</td>
+            <td style="background: #00ff00">&nbsp;</td>
+            <td style="background: #00ee11">&nbsp;</td>
+            <td style="background: #00dd22">&nbsp;</td>
+            <td style="background: #00cc33">&nbsp;</td>
+            <td style="background: #00bb44">&nbsp;</td>
+            <td style="background: #00aa55">&nbsp;</td>
+            <td style="background: #009966">&nbsp;</td>
+            <td style="background: #008877">&nbsp;</td>
+            <td style="background: #007788">&nbsp;</td>
+            <td style="background: #006699">&nbsp;</td>
+            <td style="background: #0055aa">&nbsp;</td>
+            <td style="background: #0044bb">&nbsp;</td>
+            <td style="background: #0033cc">&nbsp;</td>
+            <td style="background: #0022dd">&nbsp;</td>
+            <td style="background: #0011ee">&nbsp;</td>
+            <td style="background: #0000ff">&nbsp;</td>
+            <td style="background: black">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: black">&nbsp;</td>
+            <td style="background: #00ff00">&nbsp;</td>
+            <td style="background: #00ee11">&nbsp;</td>
+            <td style="background: #00dd22">&nbsp;</td>
+            <td style="background: #00cc33">&nbsp;</td>
+            <td style="background: #00bb44">&nbsp;</td>
+            <td style="background: #00aa55">&nbsp;</td>
+            <td style="background: #009966">&nbsp;</td>
+            <td style="background: #008877">&nbsp;</td>
+            <td style="background: #007788">&nbsp;</td>
+            <td style="background: #006699">&nbsp;</td>
+            <td style="background: #0055aa">&nbsp;</td>
+            <td style="background: #0044bb">&nbsp;</td>
+            <td style="background: #0033cc">&nbsp;</td>
+            <td style="background: #0022dd">&nbsp;</td>
+            <td style="background: #0011ee">&nbsp;</td>
+            <td style="background: #0000ff">&nbsp;</td>
+            <td style="background: white">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: white">&nbsp;</td>
+            <td style="background: #00ff00">&nbsp;</td>
+            <td style="background: #00ee11">&nbsp;</td>
+            <td style="background: #00dd22">&nbsp;</td>
+            <td style="background: #00cc33">&nbsp;</td>
+            <td style="background: #00bb44">&nbsp;</td>
+            <td style="background: #00aa55">&nbsp;</td>
+            <td style="background: #009966">&nbsp;</td>
+            <td style="background: #008877">&nbsp;</td>
+            <td style="background: #007788">&nbsp;</td>
+            <td style="background: #006699">&nbsp;</td>
+            <td style="background: #0055aa">&nbsp;</td>
+            <td style="background: #0044bb">&nbsp;</td>
+            <td style="background: #0033cc">&nbsp;</td>
+            <td style="background: #0022dd">&nbsp;</td>
+            <td style="background: #0011ee">&nbsp;</td>
+            <td style="background: #0000ff">&nbsp;</td>
+            <td style="background: black">&nbsp;</td>
+        </tr>
+    </table>
+
+    <p>The following table should have four matching rows gradually changing from fuchsia at the left to aqua at the right (plus a checkerboard at both ends to show where the rows are):</p>
+
+    <table border="border">
+        <tr>
+            <td style="background: black">&nbsp;</td>
+            <td style="background: #ff00ff">&nbsp;</td>
+            <td style="background: #ee11ff">&nbsp;</td>
+            <td style="background: #dd22ff">&nbsp;</td>
+            <td style="background: #cc33ff">&nbsp;</td>
+            <td style="background: #bb44ff">&nbsp;</td>
+            <td style="background: #aa55ff">&nbsp;</td>
+            <td style="background: #9966ff">&nbsp;</td>
+            <td style="background: #8877ff">&nbsp;</td>
+            <td style="background: #7788ff">&nbsp;</td>
+            <td style="background: #6699ff">&nbsp;</td>
+            <td style="background: #55aaff">&nbsp;</td>
+            <td style="background: #44bbff">&nbsp;</td>
+            <td style="background: #33ccff">&nbsp;</td>
+            <td style="background: #22ddff">&nbsp;</td>
+            <td style="background: #11eeff">&nbsp;</td>
+            <td style="background: #00ffff">&nbsp;</td>
+            <td style="background: white">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: white">&nbsp;</td>
+            <td style="background: #ff00ff">&nbsp;</td>
+            <td style="background: #ee11ff">&nbsp;</td>
+            <td style="background: #dd22ff">&nbsp;</td>
+            <td style="background: #cc33ff">&nbsp;</td>
+            <td style="background: #bb44ff">&nbsp;</td>
+            <td style="background: #aa55ff">&nbsp;</td>
+            <td style="background: #9966ff">&nbsp;</td>
+            <td style="background: #8877ff">&nbsp;</td>
+            <td style="background: #7788ff">&nbsp;</td>
+            <td style="background: #6699ff">&nbsp;</td>
+            <td style="background: #55aaff">&nbsp;</td>
+            <td style="background: #44bbff">&nbsp;</td>
+            <td style="background: #33ccff">&nbsp;</td>
+            <td style="background: #22ddff">&nbsp;</td>
+            <td style="background: #11eeff">&nbsp;</td>
+            <td style="background: #00ffff">&nbsp;</td>
+            <td style="background: black">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: black">&nbsp;</td>
+            <td style="background: #ff00ff">&nbsp;</td>
+            <td style="background: #ee11ff">&nbsp;</td>
+            <td style="background: #dd22ff">&nbsp;</td>
+            <td style="background: #cc33ff">&nbsp;</td>
+            <td style="background: #bb44ff">&nbsp;</td>
+            <td style="background: #aa55ff">&nbsp;</td>
+            <td style="background: #9966ff">&nbsp;</td>
+            <td style="background: #8877ff">&nbsp;</td>
+            <td style="background: #7788ff">&nbsp;</td>
+            <td style="background: #6699ff">&nbsp;</td>
+            <td style="background: #55aaff">&nbsp;</td>
+            <td style="background: #44bbff">&nbsp;</td>
+            <td style="background: #33ccff">&nbsp;</td>
+            <td style="background: #22ddff">&nbsp;</td>
+            <td style="background: #11eeff">&nbsp;</td>
+            <td style="background: #00ffff">&nbsp;</td>
+            <td style="background: white">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: white">&nbsp;</td>
+            <td style="background: #ff00ff">&nbsp;</td>
+            <td style="background: #ee11ff">&nbsp;</td>
+            <td style="background: #dd22ff">&nbsp;</td>
+            <td style="background: #cc33ff">&nbsp;</td>
+            <td style="background: #bb44ff">&nbsp;</td>
+            <td style="background: #aa55ff">&nbsp;</td>
+            <td style="background: #9966ff">&nbsp;</td>
+            <td style="background: #8877ff">&nbsp;</td>
+            <td style="background: #7788ff">&nbsp;</td>
+            <td style="background: #6699ff">&nbsp;</td>
+            <td style="background: #55aaff">&nbsp;</td>
+            <td style="background: #44bbff">&nbsp;</td>
+            <td style="background: #33ccff">&nbsp;</td>
+            <td style="background: #22ddff">&nbsp;</td>
+            <td style="background: #11eeff">&nbsp;</td>
+            <td style="background: #00ffff">&nbsp;</td>
+            <td style="background: black">&nbsp;</td>
+        </tr>
+    </table>
+
+    <p>The following table should have four matching rows gradually changing from yellow at the left to fuchsia at the right (plus a checkerboard at both ends to show where the rows are):</p>
+
+    <table border="border">
+        <tr>
+            <td style="background: black">&nbsp;</td>
+            <td style="background: #ffff00">&nbsp;</td>
+            <td style="background: #ffee11">&nbsp;</td>
+            <td style="background: #ffdd22">&nbsp;</td>
+            <td style="background: #ffcc33">&nbsp;</td>
+            <td style="background: #ffbb44">&nbsp;</td>
+            <td style="background: #ffaa55">&nbsp;</td>
+            <td style="background: #ff9966">&nbsp;</td>
+            <td style="background: #ff8877">&nbsp;</td>
+            <td style="background: #ff7788">&nbsp;</td>
+            <td style="background: #ff6699">&nbsp;</td>
+            <td style="background: #ff55aa">&nbsp;</td>
+            <td style="background: #ff44bb">&nbsp;</td>
+            <td style="background: #ff33cc">&nbsp;</td>
+            <td style="background: #ff22dd">&nbsp;</td>
+            <td style="background: #ff11ee">&nbsp;</td>
+            <td style="background: #ff00ff">&nbsp;</td>
+            <td style="background: white">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: white">&nbsp;</td>
+            <td style="background: #ffff00">&nbsp;</td>
+            <td style="background: #ffee11">&nbsp;</td>
+            <td style="background: #ffdd22">&nbsp;</td>
+            <td style="background: #ffcc33">&nbsp;</td>
+            <td style="background: #ffbb44">&nbsp;</td>
+            <td style="background: #ffaa55">&nbsp;</td>
+            <td style="background: #ff9966">&nbsp;</td>
+            <td style="background: #ff8877">&nbsp;</td>
+            <td style="background: #ff7788">&nbsp;</td>
+            <td style="background: #ff6699">&nbsp;</td>
+            <td style="background: #ff55aa">&nbsp;</td>
+            <td style="background: #ff44bb">&nbsp;</td>
+            <td style="background: #ff33cc">&nbsp;</td>
+            <td style="background: #ff22dd">&nbsp;</td>
+            <td style="background: #ff11ee">&nbsp;</td>
+            <td style="background: #ff00ff">&nbsp;</td>
+            <td style="background: black">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: black">&nbsp;</td>
+            <td style="background: #ffff00">&nbsp;</td>
+            <td style="background: #ffee11">&nbsp;</td>
+            <td style="background: #ffdd22">&nbsp;</td>
+            <td style="background: #ffcc33">&nbsp;</td>
+            <td style="background: #ffbb44">&nbsp;</td>
+            <td style="background: #ffaa55">&nbsp;</td>
+            <td style="background: #ff9966">&nbsp;</td>
+            <td style="background: #ff8877">&nbsp;</td>
+            <td style="background: #ff7788">&nbsp;</td>
+            <td style="background: #ff6699">&nbsp;</td>
+            <td style="background: #ff55aa">&nbsp;</td>
+            <td style="background: #ff44bb">&nbsp;</td>
+            <td style="background: #ff33cc">&nbsp;</td>
+            <td style="background: #ff22dd">&nbsp;</td>
+            <td style="background: #ff11ee">&nbsp;</td>
+            <td style="background: #ff00ff">&nbsp;</td>
+            <td style="background: white">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: white">&nbsp;</td>
+            <td style="background: #ffff00">&nbsp;</td>
+            <td style="background: #ffee11">&nbsp;</td>
+            <td style="background: #ffdd22">&nbsp;</td>
+            <td style="background: #ffcc33">&nbsp;</td>
+            <td style="background: #ffbb44">&nbsp;</td>
+            <td style="background: #ffaa55">&nbsp;</td>
+            <td style="background: #ff9966">&nbsp;</td>
+            <td style="background: #ff8877">&nbsp;</td>
+            <td style="background: #ff7788">&nbsp;</td>
+            <td style="background: #ff6699">&nbsp;</td>
+            <td style="background: #ff55aa">&nbsp;</td>
+            <td style="background: #ff44bb">&nbsp;</td>
+            <td style="background: #ff33cc">&nbsp;</td>
+            <td style="background: #ff22dd">&nbsp;</td>
+            <td style="background: #ff11ee">&nbsp;</td>
+            <td style="background: #ff00ff">&nbsp;</td>
+            <td style="background: black">&nbsp;</td>
+        </tr>
+    </table>
+
+    <p>The following table should have four matching rows gradually changing from aqua at the left to yellow at the right (plus a checkerboard at both ends to show where the rows are):</p>
+
+    <table border="border">
+        <tr>
+            <td style="background: black">&nbsp;</td>
+            <td style="background: #00ffff">&nbsp;</td>
+            <td style="background: #11ffee">&nbsp;</td>
+            <td style="background: #22ffdd">&nbsp;</td>
+            <td style="background: #33ffcc">&nbsp;</td>
+            <td style="background: #44ffbb">&nbsp;</td>
+            <td style="background: #55ffaa">&nbsp;</td>
+            <td style="background: #66ff99">&nbsp;</td>
+            <td style="background: #77ff88">&nbsp;</td>
+            <td style="background: #88ff77">&nbsp;</td>
+            <td style="background: #99ff66">&nbsp;</td>
+            <td style="background: #aaff55">&nbsp;</td>
+            <td style="background: #bbff44">&nbsp;</td>
+            <td style="background: #ccff33">&nbsp;</td>
+            <td style="background: #ddff22">&nbsp;</td>
+            <td style="background: #eeff11">&nbsp;</td>
+            <td style="background: #ffff00">&nbsp;</td>
+            <td style="background: white">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: white">&nbsp;</td>
+            <td style="background: #00ffff">&nbsp;</td>
+            <td style="background: #11ffee">&nbsp;</td>
+            <td style="background: #22ffdd">&nbsp;</td>
+            <td style="background: #33ffcc">&nbsp;</td>
+            <td style="background: #44ffbb">&nbsp;</td>
+            <td style="background: #55ffaa">&nbsp;</td>
+            <td style="background: #66ff99">&nbsp;</td>
+            <td style="background: #77ff88">&nbsp;</td>
+            <td style="background: #88ff77">&nbsp;</td>
+            <td style="background: #99ff66">&nbsp;</td>
+            <td style="background: #aaff55">&nbsp;</td>
+            <td style="background: #bbff44">&nbsp;</td>
+            <td style="background: #ccff33">&nbsp;</td>
+            <td style="background: #ddff22">&nbsp;</td>
+            <td style="background: #eeff11">&nbsp;</td>
+            <td style="background: #ffff00">&nbsp;</td>
+            <td style="background: black">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: black">&nbsp;</td>
+            <td style="background: #00ffff">&nbsp;</td>
+            <td style="background: #11ffee">&nbsp;</td>
+            <td style="background: #22ffdd">&nbsp;</td>
+            <td style="background: #33ffcc">&nbsp;</td>
+            <td style="background: #44ffbb">&nbsp;</td>
+            <td style="background: #55ffaa">&nbsp;</td>
+            <td style="background: #66ff99">&nbsp;</td>
+            <td style="background: #77ff88">&nbsp;</td>
+            <td style="background: #88ff77">&nbsp;</td>
+            <td style="background: #99ff66">&nbsp;</td>
+            <td style="background: #aaff55">&nbsp;</td>
+            <td style="background: #bbff44">&nbsp;</td>
+            <td style="background: #ccff33">&nbsp;</td>
+            <td style="background: #ddff22">&nbsp;</td>
+            <td style="background: #eeff11">&nbsp;</td>
+            <td style="background: #ffff00">&nbsp;</td>
+            <td style="background: white">&nbsp;</td>
+        </tr>
+        <tr>
+            <td style="background: white">&nbsp;</td>
+            <td style="background: #00ffff">&nbsp;</td>
+            <td style="background: #11ffee">&nbsp;</td>
+            <td style="background: #22ffdd">&nbsp;</td>
+            <td style="background: #33ffcc">&nbsp;</td>
+            <td style="background: #44ffbb">&nbsp;</td>
+            <td style="background: #55ffaa">&nbsp;</td>
+            <td style="background: #66ff99">&nbsp;</td>
+            <td style="background: #77ff88">&nbsp;</td>
+            <td style="background: #88ff77">&nbsp;</td>
+            <td style="background: #99ff66">&nbsp;</td>
+            <td style="background: #aaff55">&nbsp;</td>
+            <td style="background: #bbff44">&nbsp;</td>
+            <td style="background: #ccff33">&nbsp;</td>
+            <td style="background: #ddff22">&nbsp;</td>
+            <td style="background: #eeff11">&nbsp;</td>
+            <td style="background: #ffff00">&nbsp;</td>
+            <td style="background: black">&nbsp;</td>
+        </tr>
+    </table>
+</body>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-color/t421-rgb-values-meaning-b.xht b/LayoutTests/imported/w3c/web-platform-tests/css/css-color/t421-rgb-values-meaning-b.xht
new file mode 100644 (file)
index 0000000..b628d3e
--- /dev/null
@@ -0,0 +1,1550 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+       <head>
+               <title>CSS Test: rgb values</title>
+               <link rel="author" title="L. David Baron" href="https://dbaron.org/" />
+               <link rel="author" title="Mozilla Corporation" href="http://mozilla.com/" />
+               <link rel="help" href="http://www.w3.org/TR/css3-color/#rgb-color" />
+               <link rel="match" href="t421-rgb-values-meaning-b-ref.html" />
+               <meta name="flags" content="" />
+               <meta name="assert" content="Test that the color components in rgb colors are interpreted correctly." />
+               <style type="text/css"><![CDATA[
+               table { border-spacing: 0; padding: 0; border: none; }
+               td { border: none; padding: 0; }
+               td { width: 1.2em; height: 1.2em; }
+               ]]></style>
+       </head>
+       <body>
+
+               <p>The following table should have four matching rows gradually changing from red at the left to black at the right (plus a checkerboard at both ends to show where the rows are):</p>
+
+               <table border="border">
+                       <tr>
+                               <td style="background: black">&nbsp;</td>
+                               <td style="background: #ff0000">&nbsp;</td>
+                               <td style="background: #ee0000">&nbsp;</td>
+                               <td style="background: #dd0000">&nbsp;</td>
+                               <td style="background: #cc0000">&nbsp;</td>
+                               <td style="background: #bb0000">&nbsp;</td>
+                               <td style="background: #aa0000">&nbsp;</td>
+                               <td style="background: #990000">&nbsp;</td>
+                               <td style="background: #880000">&nbsp;</td>
+                               <td style="background: #770000">&nbsp;</td>
+                               <td style="background: #660000">&nbsp;</td>
+                               <td style="background: #550000">&nbsp;</td>
+                               <td style="background: #440000">&nbsp;</td>
+                               <td style="background: #330000">&nbsp;</td>
+                               <td style="background: #220000">&nbsp;</td>
+                               <td style="background: #110000">&nbsp;</td>
+                               <td style="background: #000000">&nbsp;</td>
+                               <td style="background: white">&nbsp;</td>
+                       </tr>
+                       <tr>
+                               <td style="background: white">&nbsp;</td>
+                               <td style="background: #f00">&nbsp;</td>
+                               <td style="background: #e00">&nbsp;</td>
+                               <td style="background: #d00">&nbsp;</td>
+                               <td style="background: #c00">&nbsp;</td>
+                               <td style="background: #b00">&nbsp;</td>
+                               <td style="background: #a00">&nbsp;</td>
+                               <td style="background: #900">&nbsp;</td>
+                               <td style="background: #800">&nbsp;</td>
+                               <td style="background: #700">&nbsp;</td>
+                               <td style="background: #600">&nbsp;</td>
+                               <td style="background: #500">&nbsp;</td>
+                               <td style="background: #400">&nbsp;</td>
+                               <td style="background: #300">&nbsp;</td>
+                               <td style="background: #200">&nbsp;</td>
+                               <td style="background: #100">&nbsp;</td>
+                               <td style="background: #000">&nbsp;</td>
+                               <td style="background: black">&nbsp;</td>
+                       </tr>
+                       <tr>
+                               <td style="background: black">&nbsp;</td>
+                               <td style="background: rgb(255, 0, 0)">&nbsp;</td>
+                               <td style="background: rgb(238, 0, 0)">&nbsp;</td>
+                               <td style="background: rgb(221, 0, 0)">&nbsp;</td>
+                               <td style="background: rgb(204, 0, 0)">&nbsp;</td>
+                               <td style="background: rgb(187, 0, 0)">&nbsp;</td>
+                               <td style="background: rgb(170, 0, 0)">&nbsp;</td>
+                               <td style="background: rgb(153, 0, 0)">&nbsp;</td>
+                               <td style="background: rgb(136, 0, 0)">&nbsp;</td>
+                               <td style="background: rgb(119, 0, 0)">&nbsp;</td>
+                               <td style="background: rgb(102, 0, 0)">&nbsp;</td>
+                               <td style="background: rgb(85, 0, 0)">&nbsp;</td>
+                               <td style="background: rgb(68, 0, 0)">&nbsp;</td>
+                               <td style="background: rgb(51, 0, 0)">&nbsp;</td>
+                               <td style="background: rgb(34, 0, 0)">&nbsp;</td>
+                               <td style="background: rgb(17, 0, 0)">&nbsp;</td>
+                               <td style="background: rgb(0, 0, 0)">&nbsp;</td>
+                               <td style="background: white">&nbsp;</td>
+                       </tr>
+                       <tr>
+                               <td style="background: white">&nbsp;</td>
+                               <td style="background: rgb(100%, 0%, 0%)">&nbsp;</td>
+                               <td style="background: rgb(93.3%, 0%, 0%)">&nbsp;</td>
+                               <td style="background: rgb(86.7%, 0%, 0%)">&nbsp;</td>
+                               <td style="background: rgb(80%, 0%, 0%)">&nbsp;</td>
+                               <td style="background: rgb(73.3%, 0%, 0%)">&nbsp;</td>
+                               <td style="background: rgb(66.7%, 0%, 0%)">&nbsp;</td>
+                               <td style="background: rgb(60%, 0%, 0%)">&nbsp;</td>
+                               <td style="background: rgb(53.3%, 0%, 0%)">&nbsp;</td>
+                               <td style="background: rgb(46.7%, 0%, 0%)">&nbsp;</td>
+                               <td style="background: rgb(40%, 0%, 0%)">&nbsp;</td>
+                               <td style="background: rgb(33.3%, 0%, 0%)">&nbsp;</td>
+                               <td style="background: rgb(26.7%, 0%, 0%)">&nbsp;</td>
+                               <td style="background: rgb(20%, 0%, 0%)">&nbsp;</td>
+                               <td style="background: rgb(13.3%, 0%, 0%)">&nbsp;</td>
+                               <td style="background: rgb(6.7%, 0%, 0%)">&nbsp;</td>
+                               <td style="background: rgb(0%, 0%, 0%)">&nbsp;</td>
+                               <td style="background: black">&nbsp;</td>
+                       </tr>
+               </table>
+
+               <p>The following table should have four matching rows gradually changing from white at the left to red at the right (plus a checkerboard at both ends to show where the rows are):</p>
+
+               <table border="border">
+                       <tr>
+                               <td style="background: black">&nbsp;</td>
+                               <td style="background: #ffffff">&nbsp;</td>
+                               <td style="background: #ffeeee">&nbsp;</td>
+                               <td style="background: #ffdddd">&nbsp;</td>
+                               <td style="background: #ffcccc">&nbsp;</td>
+                               <td style="background: #ffbbbb">&nbsp;</td>
+                               <td style="background: #ffaaaa">&nbsp;</td>
+                               <td style="background: #ff9999">&nbsp;</td>
+                               <td style="background: #ff8888">&nbsp;</td>
+                               <td style="background: #ff7777">&nbsp;</td>
+                               <td style="background: #ff6666">&nbsp;</td>
+                               <td style="background: #ff5555">&nbsp;</td>
+                               <td style="background: #ff4444">&nbsp;</td>
+                               <td style="background: #ff3333">&nbsp;</td>
+                               <td style="background: #ff2222">&nbsp;</td>
+                               <td style="background: #ff1111">&nbsp;</td>
+                               <td style="background: #ff0000">&nbsp;</td>
+                               <td style="background: white">&nbsp;</td>
+                       </tr>
+                       <tr>
+                               <td style="background: white">&nbsp;</td>
+                               <td style="background: #fff">&nbsp;</td>
+                               <td style="background: #fee">&nbsp;</td>
+                               <td style="background: #fdd">&nbsp;</td>
+                               <td style="background: #fcc">&nbsp;</td>
+                               <td style="background: #fbb">&nbsp;</td>
+                               <td style="background: #faa">&nbsp;</td>
+                               <td style="background: #f99">&nbsp;</td>
+                               <td style="background: #f88">&nbsp;</td>
+                               <td style="background: #f77">&nbsp;</td>
+                               <td style="background: #f66">&nbsp;</td>
+                               <td style="background: #f55">&nbsp;</td>
+                               <td style="background: #f44">&nbsp;</td>
+                               <td style="background: #f33">&nbsp;</td>
+                               <td style="background: #f22">&nbsp;</td>
+                               <td style="background: #f11">&nbsp;</td>
+                               <td style="background: #f00">&nbsp;</td>
+                               <td style="background: black">&nbsp;</td>
+                       </tr>
+                       <tr>
+                               <td style="background: black">&nbsp;</td>
+                               <td style="background: rgb(255, 255, 255)">&nbsp;</td>
+                               <td style="background: rgb(255, 238, 238)">&nbsp;</td>
+                               <td style="background: rgb(255, 221, 221)">&nbsp;</td>
+                               <td style="background: rgb(255, 204, 204)">&nbsp;</td>
+                               <td style="background: rgb(255, 187, 187)">&nbsp;</td>
+                               <td style="background: rgb(255, 170, 170)">&nbsp;</td>
+                               <td style="background: rgb(255, 153, 153)">&nbsp;</td>
+                               <td style="background: rgb(255, 136, 136)">&nbsp;</td>
+                               <td style="background: rgb(255, 119, 119)">&nbsp;</td>
+                               <td style="background: rgb(255, 102, 102)">&nbsp;</td>
+                               <td style="background: rgb(255, 85, 85)">&nbsp;</td>
+                               <td style="background: rgb(255, 68, 68)">&nbsp;</td>
+                               <td style="background: rgb(255, 51, 51)">&nbsp;</td>
+                               <td style="background: rgb(255, 34, 34)">&nbsp;</td>
+                               <td style="background: rgb(255, 17, 17)">&nbsp;</td>
+                               <td style="background: rgb(255, 0, 0)">&nbsp;</td>
+                               <td style="background: white">&nbsp;</td>
+                       </tr>
+                       <tr>
+                               <td style="background: white">&nbsp;</td>
+                               <td style="background: rgb(100%, 100%, 100%)">&nbsp;</td>
+                               <td style="background: rgb(100%, 93.3%, 93.3%)">&nbsp;</td>
+                               <td style="background: rgb(100%, 86.7%, 86.7%)">&nbsp;</td>
+                               <td style="background: rgb(100%, 80%, 80%)">&nbsp;</td>
+                               <td style="background: rgb(100%, 73.3%, 73.3%)">&nbsp;</td>
+                               <td style="background: rgb(100%, 66.7%, 66.7%)">&nbsp;</td>
+                               <td style="background: rgb(100%, 60%, 60%)">&nbsp;</td>
+                               <td style="background: rgb(100%, 53.3%, 53.3%)">&nbsp;</td>
+                               <td style="background: rgb(100%, 46.7%, 46.7%)">&nbsp;</td>
+                               <td style="background: rgb(100%, 40%, 40%)">&nbsp;</td>
+                               <td style="background: rgb(100%, 33.3%, 33.3%)">&nbsp;</td>
+                               <td style="background: rgb(100%, 26.7%, 26.7%)">&nbsp;</td>
+                               <td style="background: rgb(100%, 20%, 20%)">&nbsp;</td>
+                               <td style="background: rgb(100%, 13.3%, 13.3%)">&nbsp;</td>
+                               <td style="background: rgb(100%, 6.7%, 6.7%)">&nbsp;</td>
+                               <td style="background: rgb(100%, 0%, 0%)">&nbsp;</td>
+                               <td style="background: black">&nbsp;</td>
+                       </tr>
+               </table>
+
+               <p>The following table should have four matching rows gradually changing from green at the left to black at the right (plus a checkerboard at both ends to show where the rows are):</p>
+
+               <table border="border">
+                       <tr>
+                               <td style="background: black">&nbsp;</td>
+                               <td style="background: #00ff00">&nbsp;</td>
+                               <td style="background: #00ee00">&nbsp;</td>
+                               <td style="background: #00dd00">&nbsp;</td>
+                               <td style="background: #00cc00">&nbsp;</td>
+                               <td style="background: #00bb00">&nbsp;</td>
+                               <td style="background: #00aa00">&nbsp;</td>
+                               <td style="background: #009900">&nbsp;</td>
+                               <td style="background: #008800">&nbsp;</td>
+                               <td style="background: #007700">&nbsp;</td>
+                               <td style="background: #006600">&nbsp;</td>
+                               <td style="background: #005500">&nbsp;</td>
+                               <td style="background: #004400">&nbsp;</td>
+                               <td style="background: #003300">&nbsp;</td>
+                               <td style="background: #002200">&nbsp;</td>
+                               <td style="background: #001100">&nbsp;</td>
+                               <td style="background: #000000">&nbsp;</td>
+                               <td style="background: white">&nbsp;</td>
+                       </tr>
+                       <tr>
+                               <td style="background: white">&nbsp;</td>
+                               <td style="background: #0f0">&nbsp;</td>
+                               <td style="background: #0e0">&nbsp;</td>
+                               <td style="background: #0d0">&nbsp;</td>
+                               <td style="background: #0c0">&nbsp;</td>
+                               <td style="background: #0b0">&nbsp;</td>
+                               <td style="background: #0a0">&nbsp;</td>
+                               <td style="background: #090">&nbsp;</td>
+                               <td style="background: #080">&nbsp;</td>
+                               <td style="background: #070">&nbsp;</td>
+                               <td style="background: #060">&nbsp;</td>
+                               <td style="background: #050">&nbsp;</td>
+                               <td style="background: #040">&nbsp;</td>
+                               <td style="background: #030">&nbsp;</td>
+                               <td style="background: #020">&nbsp;</td>
+                               <td style="background: #010">&nbsp;</td>
+                               <td style="background: #000">&nbsp;</td>
+                               <td style="background: black">&nbsp;</td>
+                       </tr>
+                       <tr>
+                               <td style="background: black">&nbsp;</td>
+                               <td style="background: rgb(0, 255, 0)">&nbsp;</td>
+                               <td style="background: rgb(0, 238, 0)">&nbsp;</td>
+                               <td style="background: rgb(0, 221, 0)">&nbsp;</td>
+                               <td style="background: rgb(0, 204, 0)">&nbsp;</td>
+                               <td style="background: rgb(0, 187, 0)">&nbsp;</td>
+                               <td style="background: rgb(0, 170, 0)">&nbsp;</td>
+                               <td style="background: rgb(0, 153, 0)">&nbsp;</td>
+                               <td style="background: rgb(0, 136, 0)">&nbsp;</td>
+                               <td style="background: rgb(0, 119, 0)">&nbsp;</td>
+                               <td style="background: rgb(0, 102, 0)">&nbsp;</td>
+                               <td style="background: rgb(0, 85, 0)">&nbsp;</td>
+                               <td style="background: rgb(0, 68, 0)">&nbsp;</td>
+                               <td style="background: rgb(0, 51, 0)">&nbsp;</td>
+                               <td style="background: rgb(0, 34, 0)">&nbsp;</td>
+                               <td style="background: rgb(0, 17, 0)">&nbsp;</td>
+                               <td style="background: rgb(0, 0, 0)">&nbsp;</td>
+                               <td style="background: white">&nbsp;</td>
+                       </tr>
+                       <tr>
+                               <td style="background: white">&nbsp;</td>
+                               <td style="background: rgb(0%, 100%, 0%)">&nbsp;</td>
+                               <td style="background: rgb(0%, 93.3%, 0%)">&nbsp;</td>
+                               <td style="background: rgb(0%, 86.7%, 0%)">&nbsp;</td>
+                               <td style="background: rgb(0%, 80%, 0%)">&nbsp;</td>
+                               <td style="background: rgb(0%, 73.3%, 0%)">&nbsp;</td>
+                               <td style="background: rgb(0%, 66.7%, 0%)">&nbsp;</td>
+                               <td style="background: rgb(0%, 60%, 0%)">&nbsp;</td>
+                               <td style="background: rgb(0%, 53.3%, 0%)">&nbsp;</td>
+                               <td style="background: rgb(0%, 46.7%, 0%)">&nbsp;</td>
+                               <td style="background: rgb(0%, 40%, 0%)">&nbsp;</td>
+                               <td style="background: rgb(0%, 33.3%, 0%)">&nbsp;</td>
+                               <td style="background: rgb(0%, 26.7%, 0%)">&nbsp;</td>
+                               <td style="background: rgb(0%, 20%, 0%)">&nbsp;</td>
+                               <td style="background: rgb(0%, 13.3%, 0%)">&nbsp;</td>
+                               <td style="background: rgb(0%, 6.7%, 0%)">&nbsp;</td>
+                               <td style="background: rgb(0%, 0%, 0%)">&nbsp;</td>
+                               <td style="background: black">&nbsp;</td>
+                       </tr>
+               </table>
+
+               <p>The following table should have four matching rows gradually changing from white at the left to green at the right (plus a checkerboard at both ends to show where the rows are):</p>
+
+               <table border="border">
+                       <tr>
+                               <td style="background: black">&nbsp;</td>
+                               <td style="background: #ffffff">&nbsp;</td>
+                               <td style="background: #eeffee">&nbsp;</td>
+                               <td style="background: #ddffdd">&nbsp;</td>
+                               <td style="background: #ccffcc">&nbsp;</td>
+                               <td style="background: #bbffbb">&nbsp;</td>
+                               <td style="background: #aaffaa">&nbsp;</td>
+                               <td style="background: #99ff99">&nbsp;</td>
+                               <td style="background: #88ff88">&nbsp;</td>
+                               <td style="background: #77ff77">&nbsp;</td>
+                               <td style="background: #66ff66">&nbsp;</td>
+                               <td style="background: #55ff55">&nbsp;</td>
+                               <td style="background: #44ff44">&nbsp;</td>
+                               <td style="background: #33ff33">&nbsp;</td>
+                               <td style="background: #22ff22">&nbsp;</td>
+                               <td style="background: #11ff11">&nbsp;</td>
+                               <td style="background: #00ff00">&nbsp;</td>
+                               <td style="background: white">&nbsp;</td>
+                       </tr>
+                       <tr>
+                               <td style="background: white">&nbsp;</td>
+                               <td style="background: #fff">&nbsp;</td>
+                               <td style="background: #efe">&nbsp;</td>
+                               <td style="background: #dfd">&nbsp;</td>
+                               <td style="background: #cfc">&nbsp;</td>
+                               <td style="background: #bfb">&nbsp;</td>
+                               <td style="background: #afa">&nbsp;</td>
+                               <td style="background: #9f9">&nbsp;</td>
+                               <td style="background: #8f8">&nbsp;</td>
+                               <td style="background: #7f7">&nbsp;</td>
+                               <td style="background: #6f6">&nbsp;</td>
+                               <td style="background: #5f5">&nbsp;</td>
+                               <td style="background: #4f4">&nbsp;</td>
+                               <td style="background: #3f3">&nbsp;</td>
+                               <td style="background: #2f2">&nbsp;</td>
+                               <td style="background: #1f1">&nbsp;</td>
+                               <td style="background: #0f0">&nbsp;</td>
+                               <td style="background: black">&nbsp;</td>
+                       </tr>
+                       <tr>
+                               <td style="background: black">&nbsp;</td>
+                               <td style="background: rgb(255, 255, 255)">&nbsp;</td>
+                               <td style="background: rgb(238, 255, 238)">&nbsp;</td>
+                               <td style="background: rgb(221, 255, 221)">&nbsp;</td>
+                               <td style="background: rgb(204, 255, 204)">&nbsp;</td>
+                               <td style="background: rgb(187, 255, 187)">&nbsp;</td>
+                               <td style="background: rgb(170, 255, 170)">&nbsp;</td>
+                               <td style="background: rgb(153, 255, 153)">&nbsp;</td>
+                               <td style="background: rgb(136, 255, 136)">&nbsp;</td>
+                               <td style="background: rgb(119, 255, 119)">&nbsp;</td>
+                               <td style="background: rgb(102, 255, 102)">&nbsp;</td>
+                               <td style="background: rgb(85, 255, 85)">&nbsp;</td>
+                               <td style="background: rgb(68, 255, 68)">&nbsp;</td>
+                               <td style="background: rgb(51, 255, 51)">&nbsp;</td>
+                               <td style="background: rgb(34, 255, 34)">&nbsp;</td>
+                               <td style="background: rgb(17, 255, 17)">&nbsp;</td>
+                               <td style="background: rgb(0, 255, 0)">&nbsp;</td>
+                               <td style="background: white">&nbsp;</td>
+                       </tr>
+                       <tr>
+                               <td style="background: white">&nbsp;</td>
+                               <td style="background: rgb(100%, 100%, 100%)">&nbsp;</td>
+                               <td style="background: rgb(93.3%, 100%, 93.3%)">&nbsp;</td>
+                               <td style="background: rgb(86.7%, 100%, 86.7%)">&nbsp;</td>
+                               <td style="background: rgb(80%, 100%, 80%)">&nbsp;</td>
+                               <td style="background: rgb(73.3%, 100%, 73.3%)">&nbsp;</td>
+                               <td style="background: rgb(66.7%, 100%, 66.7%)">&nbsp;</td>
+                               <td style="background: rgb(60%, 100%, 60%)">&nbsp;</td>
+                               <td style="background: rgb(53.3%, 100%, 53.3%)">&nbsp;</td>
+                               <td style="background: rgb(46.7%, 100%, 46.7%)">&nbsp;</td>
+                               <td style="background: rgb(40%, 100%, 40%)">&nbsp;</td>
+                               <td style="background: rgb(33.3%, 100%, 33.3%)">&nbsp;</td>
+                               <td style="background: rgb(26.7%, 100%, 26.7%)">&nbsp;</td>
+                               <td style="background: rgb(20%, 100%, 20%)">&nbsp;</td>
+                               <td style="background: rgb(13.3%, 100%, 13.3%)">&nbsp;</td>
+                               <td style="background: rgb(6.7%, 100%, 6.7%)">&nbsp;</td>
+                               <td style="background: rgb(0%, 100%, 0%)">&nbsp;</td>
+                               <td style="background: black">&nbsp;</td>
+                       </tr>
+               </table>
+
+               <p>The following table should have four matching rows gradually changing from blue at the left to black at the right (plus a checkerboard at both ends to show where the rows are):</p>
+
+               <table border="border">
+                       <tr>
+                               <td style="background: black">&nbsp;</td>
+                               <td style="background: #0000ff">&nbsp;</td>
+                               <td style="background: #0000ee">&nbsp;</td>
+                               <td style="background: #0000dd">&nbsp;</td>
+                               <td style="background: #0000cc">&nbsp;</td>
+                               <td style="background: #0000bb">&nbsp;</td>
+                               <td style="background: #0000aa">&nbsp;</td>
+                               <td style="background: #000099">&nbsp;</td>
+                               <td style="background: #000088">&nbsp;</td>
+                               <td style="background: #000077">&nbsp;</td>
+                               <td style="background: #000066">&nbsp;</td>
+                               <td style="background: #000055">&nbsp;</td>
+                               <td style="background: #000044">&nbsp;</td>
+                               <td style="background: #000033">&nbsp;</td>
+                               <td style="background: #000022">&nbsp;</td>
+                               <td style="background: #000011">&nbsp;</td>
+                               <td style="background: #000000">&nbsp;</td>
+                               <td style="background: white">&nbsp;</td>
+                       </tr>
+                       <tr>
+                               <td style="background: white">&nbsp;</td>
+                               <td style="background: #00f">&nbsp;</td>
+                               <td style="background: #00e">&nbsp;</td>
+                               <td style="background: #00d">&nbsp;</td>
+                               <td style="background: #00c">&nbsp;</td>
+                               <td style="background: #00b">&nbsp;</td>
+                               <td style="background: #00a">&nbsp;</td>
+                               <td style="background: #009">&nbsp;</td>
+                               <td style="background: #008">&nbsp;</td>
+                               <td style="background: #007">&nbsp;</td>
+                               <td style="background: #006">&nbsp;</td>
+                               <td style="background: #005">&nbsp;</td>
+                               <td style="background: #004">&nbsp;</td>
+                               <td style="background: #003">&nbsp;</td>
+                               <td style="background: #002">&nbsp;</td>
+                               <td style="background: #001">&nbsp;</td>
+                               <td style="background: #000">&nbsp;</td>
+                               <td style="background: black">&nbsp;</td>
+                       </tr>
+                       <tr>
+                               <td style="background: black">&nbsp;</td>
+                               <td style="background: rgb(0, 0, 255)">&nbsp;</td>
+                               <td style="background: rgb(0, 0, 238)">&nbsp;</td>
+                               <td style="background: rgb(0, 0, 221)">&nbsp;</td>
+                               <td style="background: rgb(0, 0, 204)">&nbsp;</td>
+                               <td style="background: rgb(0, 0, 187)">&nbsp;</td>
+                               <td style="background: rgb(0, 0, 170)">&nbsp;</td>
+                               <td style="background: rgb(0, 0, 153)">&nbsp;</td>
+                               <td style="background: rgb(0, 0, 136)">&nbsp;</td>
+                               <td style="background: rgb(0, 0, 119)">&nbsp;</td>
+                               <td style="background: rgb(0, 0, 102)">&nbsp;</td>
+                               <td style="background: rgb(0, 0, 85)">&nbsp;</td>
+                               <td style="background: rgb(0, 0, 68)">&nbsp;</td>
+                               <td style="background: rgb(0, 0, 51)">&nbsp;</td>
+                               <td style="background: rgb(0, 0, 34)">&nbsp;</td>
+                               <td style="background: rgb(0, 0, 17)">&nbsp;</td>
+                               <td style="background: rgb(0, 0, 0)">&nbsp;</td>
+                               <td style="background: white">&nbsp;</td>
+                       </tr>
+                       <tr>
+                               <td style="background: white">&nbsp;</td>
+                               <td style="background: rgb(0%, 0%, 100%)">&nbsp;</td>
+                               <td style="background: rgb(0%, 0%, 93.3%)">&nbsp;</td>
+                               <td style="background: rgb(0%, 0%, 86.7%)">&nbsp;</td>
+                               <td style="background: rgb(0%, 0%, 80%)">&nbsp;</td>
+                               <td style="background: rgb(0%, 0%, 73.3%)">&nbsp;</td>
+                               <td style="background: rgb(0%, 0%, 66.7%)">&nbsp;</td>
+                               <td style="background: rgb(0%, 0%, 60%)">&nbsp;</td>
+                               <td style="background: rgb(0%, 0%, 53.3%)">&nbsp;</td>
+                               <td style="background: rgb(0%, 0%, 46.7%)">&nbsp;</td>
+                               <td style="background: rgb(0%, 0%, 40%)">&nbsp;</td>
+                               <td style="background: rgb(0%, 0%, 33.3%)">&nbsp;</td>
+                               <td style="background: rgb(0%, 0%, 26.7%)">&nbsp;</td>
+                               <td style="background: rgb(0%, 0%, 20%)">&nbsp;</td>
+                               <td style="background: rgb(0%, 0%, 13.3%)">&nbsp;</td>
+                               <td style="background: rgb(0%, 0%, 6.7%)">&nbsp;</td>
+                               <td style="background: rgb(0%, 0%, 0%)">&nbsp;</td>
+                               <td style="background: black">&nbsp;</td>
+                       </tr>
+               </table>
+
+               <p>The following table should have four matching rows gradually changing from white at the left to blue at the right (plus a checkerboard at both ends to show where the rows are):</p>
+
+               <table border="border">
+                       <tr>
+                               <td style="background: black">&nbsp;</td>
+                               <td style="background: #ffffff">&nbsp;</td>
+                               <td style="background: #eeeeff">&nbsp;</td>
+                               <td style="background: #ddddff">&nbsp;</td>
+                               <td style="background: #ccccff">&nbsp;</td>
+                               <td style="background: #bbbbff">&nbsp;</td>
+                               <td style="background: #aaaaff">&nbsp;</td>
+                               <td style="background: #9999ff">&nbsp;</td>
+                               <td style="background: #8888ff">&nbsp;</td>
+                               <td style="background: #7777ff">&nbsp;</td>
+                               <td style="background: #6666ff">&nbsp;</td>
+                               <td style="background: #5555ff">&nbsp;</td>
+                               <td style="background: #4444ff">&nbsp;</td>
+                               <td style="background: #3333ff">&nbsp;</td>
+                               <td style="background: #2222ff">&nbsp;</td>
+                               <td style="background: #1111ff">&nbsp;</td>
+                               <td style="background: #0000ff">&nbsp;</td>
+                               <td style="background: white">&nbsp;</td>
+                       </tr>
+                       <tr>
+                               <td style="background: white">&nbsp;</td>
+                               <td style="background: #fff">&nbsp;</td>
+                               <td style="background: #eef">&nbsp;</td>
+                               <td style="background: #ddf">&nbsp;</td>
+                               <td style="background: #ccf">&nbsp;</td>
+                               <td style="background: #bbf">&nbsp;</td>
+                               <td style="background: #aaf">&nbsp;</td>
+                               <td style="background: #99f">&nbsp;</td>
+                               <td style="background: #88f">&nbsp;</td>
+                               <td style="background: #77f">&nbsp;</td>
+                               <td style="background: #66f">&nbsp;</td>
+                               <td style="background: #55f">&nbsp;</td>
+                               <td style="background: #44f">&nbsp;</td>
+                               <td style="background: #33f">&nbsp;</td>
+                               <td style="background: #22f">&nbsp;</td>
+                               <td style="background: #11f">&nbsp;</td>
+                               <td style="background: #00f">&nbsp;</td>
+                               <td style="background: black">&nbsp;</td>
+                       </tr>
+                       <tr>
+                               <td style="background: black">&nbsp;</td>
+                               <td style="background: rgb(255, 255, 255)">&nbsp;</td>
+                               <td style="background: rgb(238, 238, 255)">&nbsp;</td>
+                               <td style="background: rgb(221, 221, 255)">&nbsp;</td>
+                               <td style="background: rgb(204, 204, 255)">&nbsp;</td>
+                               <td style="background: rgb(187, 187, 255)">&nbsp;</td>
+                               <td style="background: rgb(170, 170, 255)">&nbsp;</td>
+                               <td style="background: rgb(153, 153, 255)">&nbsp;</td>
+                               <td style="background: rgb(136, 136, 255)">&nbsp;</td>
+                               <td style="background: rgb(119, 119, 255)">&nbsp;</td>
+                               <td style="background: rgb(102, 102, 255)">&nbsp;</td>
+                               <td style="background: rgb(85, 85, 255)">&nbsp;</td>
+                               <td style="background: rgb(68, 68, 255)">&nbsp;</td>
+                               <td style="background: rgb(51, 51, 255)">&nbsp;</td>
+                               <td style="background: rgb(34, 34, 255)">&nbsp;</td>
+                               <td style="background: rgb(17, 17, 255)">&nbsp;</td>
+                               <td style="background: rgb(0, 0, 255)">&nbsp;</td>
+                               <td style="background: white">&nbsp;</td>
+                       </tr>
+                       <tr>
+                               <td style="background: white">&nbsp;</td>
+                               <td style="background: rgb(100%, 100%, 100%)">&nbsp;</td>
+                               <td style="background: rgb(93.3%, 93.3%, 100%)">&nbsp;</td>
+                               <td style="background: rgb(86.7%, 86.7%, 100%)">&nbsp;</td>
+                               <td style="background: rgb(80%, 80%, 100%)">&nbsp;</td>
+                               <td style="background: rgb(73.3%, 73.3%, 100%)">&nbsp;</td>
+                               <td style="background: rgb(66.7%, 66.7%, 100%)">&nbsp;</td>
+                               <td style="background: rgb(60%, 60%, 100%)">&nbsp;</td>
+                               <td style="background: rgb(53.3%, 53.3%, 100%)">&nbsp;</td>
+                               <td style="background: rgb(46.7%, 46.7%, 100%)">&nbsp;</td>
+                               <td style="background: rgb(40%, 40%, 100%)">&nbsp;</td>
+                               <td style="background: rgb(33.3%, 33.3%, 100%)">&nbsp;</td>
+                               <td style="background: rgb(26.7%, 26.7%, 100%)">&nbsp;</td>
+                               <td style="background: rgb(20%, 20%, 100%)">&nbsp;</td>
+                               <td style="background: rgb(13.3%, 13.3%, 100%)">&nbsp;</td>
+                               <td style="background: rgb(6.7%, 6.7%, 100%)">&nbsp;</td>
+                               <td style="background: rgb(0%, 0%, 100%)">&nbsp;</td>
+                               <td style="background: black">&nbsp;</td>
+                       </tr>
+               </table>
+
+               <p>The following table should have four matching rows gradually changing from yellow at the left to black at the right (plus a checkerboard at both ends to show where the rows are):</p>
+
+               <table border="border">
+                       <tr>
+                               <td style="background: black">&nbsp;</td>
+                               <td style="background: #ffff00">&nbsp;</td>
+                               <td style="background: #eeee00">&nbsp;</td>
+                               <td style="background: #dddd00">&nbsp;</td>
+                               <td style="background: #cccc00">&nbsp;</td>
+                               <td style="background: #bbbb00">&nbsp;</td>
+                               <td style="background: #aaaa00">&nbsp;</td>
+                               <td style="background: #999900">&nbsp;</td>
+                               <td style="background: #888800">&nbsp;</td>
+                               <td style="background: #777700">&nbsp;</td>
+                               <td style="background: #666600">&nbsp;</td>
+                               <td style="background: #555500">&nbsp;</td>
+                               <td style="background: #444400">&nbsp;</td>
+                               <td style="background: #333300">&nbsp;</td>
+                               <td style="background: #222200">&nbsp;</td>
+                               <td style="background: #111100">&nbsp;</td>
+                               <td style="background: #000000">&nbsp;</td>
+                               <td style="background: white">&nbsp;</td>
+                       </tr>
+                       <tr>
+                               <td style="background: white">&nbsp;</td>
+                               <td style="background: #ff0">&nbsp;</td>
+                               <td style="background: #ee0">&nbsp;</td>
+                               <td style="background: #dd0">&nbsp;</td>
+                               <td style="background: #cc0">&nbsp;</td>
+                               <td style="background: #bb0">&nbsp;</td>
+                               <td style="background: #aa0">&nbsp;</td>
+                               <td style="background: #990">&nbsp;</td>
+                               <td style="background: #880">&nbsp;</td>
+