blob: 0c87611f3ff0090345b6402f2f8441b9428d58d5 (
plain) (
blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
|
<!DOCTYPE html>
<html><head>
<title>CSS Transforms Test: SVG presentation attribute, matrix on group, scaleY on child1, translateY on child2</title>
<link href="mailto:dalcala@adobe.com" rel="author" title="David Alcala">
<link href="http://www.w3.org/TR/css-transforms-1/#svg-transform" rel="help">
<link href="http://www.w3.org/TR/css-transforms-1/#two-d-transform-functions" rel="help">
<link href="reference/svg-green-square-ref.htm" rel="match">
<meta content="svg" name="flags">
<meta content="Transforms on parent elements should be pre-multiplied to transforms on child elements. The group of elements should have the transform matrix applied. Additionally, the first rect should be translated vertically and the second rect should be scaled vertically." name="assert">
<style type="text/css">
svg {
width: 300px;
height: 300px;
}
</style>
</head>
<body>
<p>The test passes if there is a green square and no red.</p>
<svg>
<rect y="41" width="78" fill="red" x="41" height="78"></rect> <!-- this rect is outside the group to catch failures of the group transform -->
<g transform="matrix(-0.5 0 0 -0.5 120 90)">
<rect width="156" y="-116" x="2" fill="red" transform="scaleY(0.5)" height="312"></rect> <!-- false positive if scaleY is between 0.4 and -0.3 -->
<rect width="160" fill="green" transform="translateY(-60)" height="160"></rect>
</g>
</svg>
</body></html>
|
