translate-parsing-valid.html (1688B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>CSS Transform Module Level 2: parsing translate with valid values</title> 6 <link rel="help" href="https://drafts.csswg.org/css-transforms-2/#propdef-translate"> 7 <meta name="assert" content="translate supports the full grammar 'none | <length-percentage> [ <length-percentage> <length>? ]?'."> 8 <script src="/resources/testharness.js"></script> 9 <script src="/resources/testharnessreport.js"></script> 10 <script src="/css/support/parsing-testcommon.js"></script> 11 </head> 12 <body> 13 <script> 14 test_valid_value("translate", "none"); 15 16 test_valid_value("translate", "0px"); 17 test_valid_value("translate", "100%"); 18 19 test_valid_value("translate", "100px 0px", "100px"); 20 test_valid_value("translate", "100px 0.1px", "100px 0.1px"); 21 test_valid_value("translate", "100px 0%"); 22 test_valid_value("translate", "100px calc(10px - 10%)", "100px calc(-10% + 10px)"); 23 test_valid_value("translate", "100px 200%"); 24 test_valid_value("translate", "100% 200px"); 25 26 test_valid_value("translate", "100px 200px 0px", "100px 200px"); 27 test_valid_value("translate", "100px 0px 300px", "100px 0px 300px"); 28 test_valid_value("translate", "100px 0px 0px", "100px"); 29 test_valid_value("translate", "100px 200px 300px"); 30 test_valid_value("translate", "100% 200% 300px"); 31 32 test_valid_value("translate", "100% 0% 200px", "100% 0% 200px"); 33 test_valid_value("translate", "0% 0% 100px", "0% 0% 100px"); 34 test_valid_value("translate", "0em 0em 100px", "0em 0em 100px"); 35 36 test_valid_value("translate", "calc(10% + 10px) calc(20% + 20px) calc(30em + 30px)"); 37 38 test_valid_value("translate", "0", "0px"); 39 test_valid_value("translate", "1px 2px 0", "1px 2px"); 40 </script> 41 </body> 42 </html>