diff options
Diffstat (limited to 'tests/wpt/css-tests/css-transforms-1_dev/xhtml1/css-transform-scale-002.xht')
| -rw-r--r-- | tests/wpt/css-tests/css-transforms-1_dev/xhtml1/css-transform-scale-002.xht | 47 |
1 files changed, 47 insertions, 0 deletions
diff --git a/tests/wpt/css-tests/css-transforms-1_dev/xhtml1/css-transform-scale-002.xht b/tests/wpt/css-tests/css-transforms-1_dev/xhtml1/css-transform-scale-002.xht new file mode 100644 index 00000000000..332962c3bab --- /dev/null +++ b/tests/wpt/css-tests/css-transforms-1_dev/xhtml1/css-transform-scale-002.xht @@ -0,0 +1,47 @@ +<!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 Transforms Test: transform property with scale function and move its origin</title> + <link href="mailto:granimalcracker@gmail.com" rel="author" title="Chris Sanborn" /> + <link href="http://www.w3.org/TR/css-transforms-1/#transform-property" rel="help" /> + <link href="http://www.w3.org/TR/css-transforms-1/#transform-origin-property" rel="help" /> + <link href="http://dev.w3.org/csswg/css-transforms-1/#transform-functions" rel="help" /> + <link href="reference/css-transform-scale-ref-002.xht" rel="match" /> + <meta content="The transform scales the element to twice its size in both the X and Y directions and moves its origin to the top left corner." name="assert" /> + <style type="text/css"> + .container { + position: absolute; + } + .greenSquare { + position: absolute; + top: 0; + left: 0; + width: 100px; + height: 100px; + background-color: green; + transform-origin: 0 0; + transform: scale(2); + } + + + /* This div should only be visible if the test fails */ + .redSquare { + position: absolute; + /* It is approximately the same size as the test div, but with a 1px margin */ + width: 98px; + height: 98px; + background-color: red; + left: 100px; + top :100px; + } + </style> +</head> +<body> + <p>The test passes if the green square completely covers the red square.</p> + <div class="container"> + <!-- This is the square that should not be visible if the test passes --> + <div class="redSquare"></div> + <!-- This is the square being tested with the transform --> + <div class="greenSquare"></div> + </div> + +</body></html>
\ No newline at end of file |