grid-template-rows-invalid.html (3924B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>CSS Grid Layout Test: parsing grid-template-rows with invalid values</title> 6 <link rel="help" href="https://drafts.csswg.org/css-grid-1/#propdef-grid-template-rows"> 7 <meta name="assert" content="grid-template-rows supports only the grammar 'none | <track-list> | <auto-track-list>'."> 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_invalid_value("grid-template-rows", '-10px'); 15 test_invalid_value("grid-template-rows", '-20%'); 16 test_invalid_value("grid-template-rows", '-5fr'); 17 test_invalid_value("grid-template-rows", 'minmax(5fr, calc(0.5em + 10px))'); 18 test_invalid_value("grid-template-rows", 'minmax(-10px, auto)'); 19 test_invalid_value("grid-template-rows", 'minmax(-20%, max-content)'); 20 test_invalid_value("grid-template-rows", 'minmax(min-content, -20%)'); 21 test_invalid_value("grid-template-rows", 'fit-content(-10px)'); 22 test_invalid_value("grid-template-rows", 'fit-content(-20%)'); 23 test_invalid_value("grid-template-rows", '[one] 10px [two three] repeat(20%) [four five six] 3fr [seven]'); 24 test_invalid_value("grid-template-rows", '[one]'); 25 test_invalid_value("grid-template-rows", '[one] 10px [two] [three]'); 26 test_invalid_value("grid-template-rows", 'repeat(auto-fill, -10px)'); 27 test_invalid_value("grid-template-rows", 'repeat(auto-fill, 10px) repeat(auto-fit, 20%)'); 28 test_invalid_value("grid-template-rows", '[auto] 1px'); 29 test_invalid_value("grid-template-rows", '-10px repeat(auto-fit, auto)'); 30 test_invalid_value("grid-template-rows", '-10px repeat(auto-fill, min-content)'); 31 test_invalid_value("grid-template-rows", '-20% repeat(auto-fit, max-content)'); 32 test_invalid_value("grid-template-rows", 'repeat(auto-fill, fit-content)'); 33 test_invalid_value("grid-template-rows", 'auto repeat(auto-fill, auto) auto'); 34 test_invalid_value("grid-template-rows", 'min-content repeat(auto-fill, auto) min-content'); 35 test_invalid_value("grid-template-rows", 'max-content repeat(auto-fill, auto) max-content'); 36 test_invalid_value("grid-template-rows", 'fit-content(200px) repeat(auto-fill, auto) fit-content(200px)'); 37 test_invalid_value("grid-template-rows", 'auto repeat(auto-fill, auto) repeat(5, auto)'); 38 test_invalid_value("grid-template-rows", 'auto repeat(auto-fill, min-content) auto'); 39 test_invalid_value("grid-template-rows", 'min-content repeat(auto-fill, min-content) min-content'); 40 test_invalid_value("grid-template-rows", 'max-content repeat(auto-fill, min-content) max-content'); 41 test_invalid_value("grid-template-rows", 'fit-content(200px) repeat(auto-fill, min-content) fit-content(200px)'); 42 test_invalid_value("grid-template-rows", 'min-content repeat(auto-fill, min-content) repeat(5, min-content)'); 43 test_invalid_value("grid-template-rows", 'auto repeat(auto-fill, max-content) auto'); 44 test_invalid_value("grid-template-rows", 'min-content repeat(auto-fill, max-content) min-content'); 45 test_invalid_value("grid-template-rows", 'max-content repeat(auto-fill, max-content) max-content'); 46 test_invalid_value("grid-template-rows", 'fit-content(200px) repeat(auto-fill, max-content) fit-content(200px)'); 47 test_invalid_value("grid-template-rows", 'max-content repeat(auto-fill, max-content) repeat(5, max-content)'); 48 test_invalid_value("grid-template-rows", 'auto repeat(auto-fill, fit-content(200px)) auto'); 49 test_invalid_value("grid-template-rows", 'min-content repeat(auto-fill, fit-content(200px)) min-content'); 50 test_invalid_value("grid-template-rows", 'max-content repeat(auto-fill, fit-content(200px)) max-content'); 51 test_invalid_value("grid-template-rows", 'fit-content(200px) repeat(auto-fill, fit-content(200px)) fit-content(200px)'); 52 test_invalid_value("grid-template-rows", 'fit-content(200px) repeat(auto-fill, fit-content(200px)) repeat(5, fit-content(200px))'); 53 </script> 54 </body> 55 </html>