grid-template-rows-repeat-intrinsic-valid.tentative.html (2144B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>CSS Grid Layout Test: parsing grid-template-rows with valid values</title> 6 <link rel="help" href="https://drafts.csswg.org/css-grid-3/#masonry-intrinsic-repeat"> 7 <meta name="assert" content="grid-template-rows supports the full 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 // <auto-repeat> = repeat( [ auto-fill | auto-fit ] , [ <line-names>? <intrinsic-or-fixed-size> ]+ <line-names>? ) 15 // <intrinsic-or-fixed-size> = [<fixed-size> | <intrinsic-size>] 16 test_valid_value("grid-template-rows", 'repeat(auto-fill, auto)'); 17 test_valid_value("grid-template-rows", 'repeat(auto-fit, auto 100px auto)'); 18 test_valid_value("grid-template-rows", 'repeat(auto-fill, minmax(30px, 5fr) [two] auto)'); 19 test_valid_value("grid-template-rows", 'repeat(auto-fit, [three] auto [four])'); 20 21 test_valid_value("grid-template-rows", 'repeat(auto-fill, min-content)'); 22 test_valid_value("grid-template-rows", 'repeat(auto-fit, min-content 100px min-content)'); 23 test_valid_value("grid-template-rows", 'repeat(auto-fill, minmax(30px, 5fr) [two] min-content)'); 24 test_valid_value("grid-template-rows", 'repeat(auto-fit, [three] min-content [four])'); 25 26 test_valid_value("grid-template-rows", 'repeat(auto-fill, max-content)'); 27 test_valid_value("grid-template-rows", 'repeat(auto-fit, max-content 100px max-content)'); 28 test_valid_value("grid-template-rows", 'repeat(auto-fill, minmax(30px, 5fr) [two] max-content)'); 29 test_valid_value("grid-template-rows", 'repeat(auto-fit, [three] max-content [four])'); 30 31 test_valid_value("grid-template-rows", 'repeat(auto-fill, fit-content(200px))'); 32 test_valid_value("grid-template-rows", 'repeat(auto-fit, fit-content(200px) 100px fit-content(200px))'); 33 test_valid_value("grid-template-rows", 'repeat(auto-fill, minmax(30px, 5fr) [two] fit-content(200px))'); 34 test_valid_value("grid-template-rows", 'repeat(auto-fit, [three] fit-content(200px) [four])'); 35 </script> 36 </body> 37 </html>