mirror of
https://github.com/servo/servo.git
synced 2025-06-23 08:34:42 +01:00
27 lines
No EOL
1.4 KiB
HTML
27 lines
No EOL
1.4 KiB
HTML
<!DOCTYPE html>
|
|
<html><head>
|
|
<title>CSS Transforms Test: SVG presentation attribute with relative and absolute combined translation-value arguments for translate - relative width, tx in %, ty unit less</title>
|
|
<link href="mailto:rhauck@adobe.com" rel="author" title="Rebecca Hauck">
|
|
<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="http://www.w3.org/TR/css-transforms-1/#funcdef-translate" rel="help">
|
|
<link href="http://www.w3.org/TR/css-transforms-1/#svg-transform-value" rel="help">
|
|
<link href="reference/svg-translate-relative-ref.htm" rel="match">
|
|
<meta content="svg" name="flags">
|
|
<meta content="The translate transform function can have combinations of relative and absolute arguments and can be applied to relative sized shapes. The rect in the test should be moved 50 pixels in the X direction and 100 pixels in the Y direction" name="assert">
|
|
<style type="text/css">
|
|
svg {
|
|
width: 200px;
|
|
height: 400px;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<p>The test passes if there is a green rectangle and no red.</p>
|
|
<svg>
|
|
<rect y="101" width="98" fill="red" x="51" height="198"></rect>
|
|
<rect width="50%" fill="green" transform="translate(50% 100)" height="200"></rect>
|
|
</svg>
|
|
|
|
|
|
</body></html> |