svg-rotate-angle-45-001.html (1465B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>CSS Transforms Test: SVG presentation attribute and angle argument without unit on rotate</title> 5 <link rel="author" title="Rebecca Hauck" href="mailto:rhauck@adobe.com"> 6 <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#svg-transform"> 7 <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#svg-angle"> 8 <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#two-d-transform-functions"> 9 <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#funcdef-transform-rotate"> 10 <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#svg-transform-value"> 11 <link rel="match" href="reference/svg-rotate-angle-45-ref.html"> 12 <meta name="fuzzy" content="maxDifference=0-1;totalPixels=0-142"> 13 <meta name="flags" content="svg"> 14 <meta name="assert" content="The rotate transform function must support unit less arguments for angle. The green rect in the test should be rotated by 45 degrees clockwise to completely cover the red path."> 15 <style type="text/css"> 16 svg { 17 width: 250px; 18 height: 250px; 19 background: green; 20 } 21 </style> 22 </head> 23 <body> 24 <p>The test passes if there is a green square and no red.</p> 25 <svg> 26 <path d="M 106,37 175,106 106,175 37,106 Z" fill="red"/> 27 <rect x="100" y="-50" width="100" height="100" fill="green" transform="rotate(45)"/> 28 </svg> 29 </body> 30 </html>