mirror of
https://github.com/servo/servo.git
synced 2025-06-23 08:34:42 +01:00
26 lines
No EOL
1.3 KiB
HTML
26 lines
No EOL
1.3 KiB
HTML
<!DOCTYPE html>
|
|
<html><head>
|
|
<title>CSS Transforms Test: SVG presentation attribute with relative and absolute combined translation-value arguments for translate - relative height, tx in px, ty in %</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="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 50 pixels in the Y direction" name="assert">
|
|
<style type="text/css">
|
|
svg {
|
|
width: 400px;
|
|
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="100" fill="green" transform="translate(50px 50%)" height="50%"></rect>
|
|
</svg>
|
|
|
|
|
|
</body></html> |