diff options
Diffstat (limited to 'tests/wpt/css-tests/css-transforms-1_dev/html/css-transform-3d-rotateX-negative.htm')
| -rw-r--r-- | tests/wpt/css-tests/css-transforms-1_dev/html/css-transform-3d-rotateX-negative.htm | 38 |
1 files changed, 38 insertions, 0 deletions
diff --git a/tests/wpt/css-tests/css-transforms-1_dev/html/css-transform-3d-rotateX-negative.htm b/tests/wpt/css-tests/css-transforms-1_dev/html/css-transform-3d-rotateX-negative.htm new file mode 100644 index 00000000000..b05dbbba6b6 --- /dev/null +++ b/tests/wpt/css-tests/css-transforms-1_dev/html/css-transform-3d-rotateX-negative.htm @@ -0,0 +1,38 @@ +<!DOCTYPE html> +<html><head> + <meta charset="utf-8"> + <title>CSS Transforms Test: rotateX on div element</title> + <link href="http://www.intel.com" rel="author" title="Intel"> + <link href="http://www.w3.org/TR/css-transforms-1/#three-d-transform-functions" rel="help"> + <link href="reference/css-transform-3d-rotateX-ref.htm" rel="match"> + <meta content="" name="flags"> + <meta content="Test checks that rotate a 2:1 rectangle on X-axis for -60 degree we will get a square and completely cover the red square, and here we use border due to the rectangle not be rotated would cover the red square." name="assert"> + <style> + div { + left: 20px; + position: absolute; + top: 35px; + } + div.redsquare { + background-color: red; + border: 5px solid black; + height: 120px; + left: 15px; + top: 90px; + width: 120px; + } + div.green { + background-color: green; + height: 240px; + transform: rotateX(-60deg); + width: 120px; + } + </style> + </head> + <body> + <p>Test passes if there is a green square with black border around, and no any red.</p> + <div class="redsquare"></div> + <div class="green"></div> + + +</body></html>
\ No newline at end of file |