parse-justify-items-002.html (2434B)
1 <!DOCTYPE html> 2 <meta charset=utf-8> 3 <title>Default-Alignment: justify-items - 'initial' value</title> 4 <link rel="author" title="Javier Fernandez" href="mailto:jfernandez@igalia.com" /> 5 <link rel="help" href="https://drafts.csswg.org/css-align-3/#default-alignment" /> 6 <link rel="help" href="https://drafts.csswg.org/css-align-3/#propdef-justify-items" /> 7 <link rel="help" href="https://drafts.csswg.org/css-cascade/#initial-values" /> 8 <meta name="assert" content="Check the 'initial' value in different scenarios."/> 9 <script src="/resources/testharness.js"></script> 10 <script src="/resources/testharnessreport.js"></script> 11 <script src="/css/css-align/resources/alignment-parsing-utils.js"></script> 12 <div id="log"></div> 13 <script> 14 container = document.createElement("div"); 15 element = document.createElement("div"); 16 container.appendChild(element); 17 document.body.appendChild(container); 18 19 test(function() { 20 element = document.createElement("div"); 21 document.body.appendChild(element); 22 checkValues(element, "justifyItems", "justify-items", "", "normal"); 23 }, "Test 'initial' value when nothing is specified"); 24 25 test(function() { 26 container.style.display = ""; 27 checkInitialValues(element, "justifyItems", "justify-items", "center", "normal"); 28 }, "Test justify-items: 'initial'"); 29 30 test(function() { 31 container.style.display = "grid"; 32 checkInitialValues(element, "justifyItems", "justify-items", "safe start", "normal"); 33 }, "Test grid items justify-items: 'initial'"); 34 35 test(function() { 36 container.style.display = "flex"; 37 checkInitialValues(element, "justifyItems", "justify-items", "unsafe end", "normal"); 38 }, "Test flex items justify-items: 'initial'"); 39 40 test(function() { 41 container.style.display = ""; 42 element.style.position = "absolute"; 43 checkInitialValues(element, "justifyItems", "justify-items", "start", "normal"); 44 }, "Test absolute positioned elements justify-items: 'initial'"); 45 46 test(function() { 47 container.style.display = "grid"; 48 element.style.position = "absolute"; 49 checkInitialValues(element, "justifyItems", "justify-items", "end", "normal"); 50 }, "Test absolute positioned grid items justify-items: 'initial'"); 51 52 test(function() { 53 container.style.display = "flex"; 54 element.style.position = "absolute"; 55 checkInitialValues(element, "justifyItems", "justify-items", "end", "normal"); 56 }, "Test absolute positioned flex items justify-items: 'initial'"); 57 </script>