blob: dca17bc5aeeb61866a4d240e71d2090fb9e8eb17 [file] [log] [blame]
commit-queue@webkit.org773d07a2013-01-16 06:15:31 +00001<!DOCTYPE html>
2
3<html>
4<head>
5 <style type="text/css" media="screen">
6 .box {
7 display: inline-block;
8 height: 120px;
9 width: 200px;
10 margin: 10px;
11 border: 1px solid black;
12 background-repeat: no-repeat;
13 }
14
15 .linear1 {
16 background-image: repeating-linear-gradient(white, black 20%);
17 }
18
19 .linear2 {
20 background-image: repeating-linear-gradient(white 80%, black);
21 }
22
23 .linear3 {
24 background-image: repeating-linear-gradient(to top right, red, blue 20px, red 40px);
25 }
26
27 .linear4 {
28 background-image: repeating-linear-gradient(to right, red 10%, blue 30%);
29 }
30
31 .linear5 {
32 background-image: repeating-linear-gradient(to right, red -10%, blue -5%);
33 }
34
35 .linear6 {
36 background-image: repeating-linear-gradient(to right, red -10%, blue 105%);
37 }
38
39 .linear7 {
40 background-image: repeating-linear-gradient(to right, red 90%, blue 105%);
41 }
42
43 .linear8 {
44 background-image: repeating-linear-gradient(to right, red 2em, blue 3em);
45 }
46
47 .linear9 {
48 background-image: repeating-linear-gradient(to right, red, orange, yellow, green, blue, red 60px);
49 }
50
cabanier@adobe.com5cc6cd42014-10-02 00:49:37 +000051 .linear10 {
52 background-image: repeating-linear-gradient(to right, red 90%, 95%, blue 105%);
53 }
54
55 .linear11 {
56 background-image: repeating-linear-gradient(to right, red 2em, 2.1em, blue 3em);
57 }
58
59 .linear12 {
60 background-image: repeating-linear-gradient(to right, red, 55px, blue 60px);
61 }
62
commit-queue@webkit.org773d07a2013-01-16 06:15:31 +000063 </style>
64 <script type="text/javascript" charset="utf-8">
65 if (window.testRunner) {
66 var dumpPixels = true;
67 testRunner.dumpAsText(dumpPixels);
68 }
69 </script>
70</head>
71<body>
72
73 <div class="linear1 box"></div>
74 <div class="linear2 box"></div>
75 <div class="linear3 box"></div>
76 <br>
77 <div class="linear4 box"></div>
78 <div class="linear5 box"></div>
79 <div class="linear6 box"></div>
80 <br>
81 <div class="linear7 box"></div>
82 <div class="linear8 box"></div>
83 <div class="linear9 box"></div>
cabanier@adobe.com5cc6cd42014-10-02 00:49:37 +000084 <br>
85 <div class="linear10 box"></div>
86 <div class="linear11 box"></div>
87 <div class="linear12 box"></div>
commit-queue@webkit.org773d07a2013-01-16 06:15:31 +000088
89</body>
90</html>