| OLD | NEW |
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 <html> | |
| 3 <head> | |
| 4 <style> | 2 <style> |
| 5 #justifySelfBaseline { | 3 #justifySelfBaseline { |
| 6 justify-self: baseline; | 4 justify-self: baseline; |
| 7 } | 5 } |
| 8 | 6 |
| 7 #justifySelfFirstBaseline { |
| 8 justify-self: first baseline; |
| 9 } |
| 10 |
| 9 #justifySelfLastBaseline { | 11 #justifySelfLastBaseline { |
| 10 justify-self: last-baseline; | 12 justify-self: last baseline; |
| 11 } | 13 } |
| 12 | 14 |
| 13 #justifySelfStretch { | 15 #justifySelfStretch { |
| 14 justify-self: stretch; | 16 justify-self: stretch; |
| 15 } | 17 } |
| 16 | 18 |
| 17 #justifySelfStart { | 19 #justifySelfStart { |
| 18 justify-self: start; | 20 justify-self: start; |
| 19 } | 21 } |
| 20 | 22 |
| (...skipping 54 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 75 } | 77 } |
| 76 | 78 |
| 77 #justifySelfFlexStartUnsafe { | 79 #justifySelfFlexStartUnsafe { |
| 78 justify-self: flex-start unsafe; | 80 justify-self: flex-start unsafe; |
| 79 } | 81 } |
| 80 | 82 |
| 81 #justifySelfFlexEndSafe { | 83 #justifySelfFlexEndSafe { |
| 82 justify-self: flex-end safe; | 84 justify-self: flex-end safe; |
| 83 } | 85 } |
| 84 </style> | 86 </style> |
| 85 <script src="../../resources/js-test.js"></script> | 87 <p>Test that setting and getting justify-self works as expected</p> |
| 86 </head> | |
| 87 <body> | |
| 88 <div id="justifySelfBaseline"></div> | 88 <div id="justifySelfBaseline"></div> |
| 89 <div id="justifySelfFirstBaseline"></div> |
| 89 <div id="justifySelfLastBaseline"></div> | 90 <div id="justifySelfLastBaseline"></div> |
| 90 <div id="justifySelfStretch"></div> | 91 <div id="justifySelfStretch"></div> |
| 91 <div id="justifySelfStart"></div> | 92 <div id="justifySelfStart"></div> |
| 92 <div id="justifySelfEnd"></div> | 93 <div id="justifySelfEnd"></div> |
| 93 <div id="justifySelfCenter"></div> | 94 <div id="justifySelfCenter"></div> |
| 94 <div id="justifySelfSelfStart"></div> | 95 <div id="justifySelfSelfStart"></div> |
| 95 <div id="justifySelfSelfEnd"></div> | 96 <div id="justifySelfSelfEnd"></div> |
| 96 <div id="justifySelfLeft"></div> | 97 <div id="justifySelfLeft"></div> |
| 97 <div id="justifySelfRight"></div> | 98 <div id="justifySelfRight"></div> |
| 98 <div id="justifySelfFlexStart"></div> | 99 <div id="justifySelfFlexStart"></div> |
| 99 <div id="justifySelfFlexEnd"></div> | 100 <div id="justifySelfFlexEnd"></div> |
| 100 | 101 |
| 101 <div id="justifySelfEndUnsafe"></div> | 102 <div id="justifySelfEndUnsafe"></div> |
| 102 <div id="justifySelfCenterUnsafe"></div> | 103 <div id="justifySelfCenterUnsafe"></div> |
| 103 <div id="justifySelfSelfEndSafe"></div> | 104 <div id="justifySelfSelfEndSafe"></div> |
| 104 <div id="justifySelfSelfStartSafe"></div> | 105 <div id="justifySelfSelfStartSafe"></div> |
| 105 <div id="justifySelfRightSafe"></div> | 106 <div id="justifySelfRightSafe"></div> |
| 106 <div id="justifySelfLeftUnsafe"></div> | 107 <div id="justifySelfLeftUnsafe"></div> |
| 107 <div id="justifySelfFlexStartUnsafe"></div> | 108 <div id="justifySelfFlexStartUnsafe"></div> |
| 108 <div id="justifySelfFlexEndSafe"></div> | 109 <div id="justifySelfFlexEndSafe"></div> |
| 109 <script src="resources/alignment-parsing-utils.js"></script> | 110 <script src="../../resources/testharness.js"></script> |
| 111 <script src="../../resources/testharnessreport.js"></script> |
| 112 <script src="resources/alignment-parsing-utils-th.js"></script> |
| 110 <script> | 113 <script> |
| 111 description('Test that setting and getting justify-self works as expected'); | 114 test(function() { |
| 115 var justifySelfBaseline = document.getElementById("justifySelfBaseline"); |
| 116 checkValues(justifySelfBaseline, "justifySelf", "justify-self", "", "baselin
e"); |
| 117 var justifySelfFirstBaseline = document.getElementById("justifySelfFirstBase
line"); |
| 118 checkValues(justifySelfFirstBaseline, "justifySelf", "justify-self", "", "ba
seline"); |
| 119 var justifySelfLastBaseline = document.getElementById("justifySelfLastBaseli
ne"); |
| 120 checkValues(justifySelfLastBaseline, "justifySelf", "justify-self", "", "las
t baseline"); |
| 121 var justifySelfStretch = document.getElementById("justifySelfStretch"); |
| 122 checkValues(justifySelfStretch, "justifySelf", "justify-self", "", "stretch"
); |
| 123 var justifySelfStart = document.getElementById("justifySelfStart"); |
| 124 checkValues(justifySelfStart, "justifySelf", "justify-self", "", "start"); |
| 125 var justifySelfEnd = document.getElementById("justifySelfEnd"); |
| 126 checkValues(justifySelfEnd, "justifySelf", "justify-self", "", "end"); |
| 127 var justifySelfCenter = document.getElementById("justifySelfCenter"); |
| 128 checkValues(justifySelfCenter, "justifySelf", "justify-self", "", "center"); |
| 129 var justifySelfSelfEnd = document.getElementById("justifySelfSelfEnd"); |
| 130 checkValues(justifySelfSelfEnd, "justifySelf", "justify-self", "", "self-end
"); |
| 131 var justifySelfSelfStart = document.getElementById("justifySelfSelfStart"); |
| 132 checkValues(justifySelfSelfStart, "justifySelf", "justify-self", "", "self-s
tart"); |
| 133 var justifySelfLeft = document.getElementById("justifySelfLeft"); |
| 134 checkValues(justifySelfLeft, "justifySelf", "justify-self", "", "left"); |
| 135 var justifySelfRight = document.getElementById("justifySelfRight"); |
| 136 checkValues(justifySelfRight, "justifySelf", "justify-self", "", "right"); |
| 137 var justifySelfFlexStart = document.getElementById("justifySelfFlexStart"); |
| 138 checkValues(justifySelfFlexStart, "justifySelf", "justify-self", "", "flex-s
tart"); |
| 139 var justifySelfFlexEnd = document.getElementById("justifySelfFlexEnd"); |
| 140 checkValues(justifySelfFlexEnd, "justifySelf", "justify-self", "", "flex-end
"); |
| 112 | 141 |
| 113 debug("Test getting justify-self set through CSS"); | 142 var justifySelfEndUnsafe = document.getElementById("justifySelfEndUnsafe"); |
| 114 var justifySelfBaseline = document.getElementById("justifySelfBaseline"); | 143 checkValues(justifySelfEndUnsafe, "justifySelf", "justify-self", "", "end un
safe"); |
| 115 shouldBe("getComputedStyle(justifySelfBaseline, '').getPropertyValue('justify-se
lf')", "'baseline'"); | 144 var justifySelfCenterUnsafe = document.getElementById("justifySelfCenterUnsa
fe"); |
| 145 checkValues(justifySelfCenterUnsafe, "justifySelf", "justify-self", "", "cen
ter unsafe"); |
| 146 var justifySelfSelfEndSafe = document.getElementById("justifySelfSelfEndSafe
"); |
| 147 checkValues(justifySelfSelfEndSafe, "justifySelf", "justify-self", "", "self
-end safe"); |
| 148 var justifySelfSelfStartSafe = document.getElementById("justifySelfSelfStart
Safe"); |
| 149 checkValues(justifySelfSelfStartSafe, "justifySelf", "justify-self", "", "se
lf-start safe"); |
| 150 var justifySelfRightSafe = document.getElementById("justifySelfRightSafe"); |
| 151 checkValues(justifySelfRightSafe, "justifySelf", "justify-self", "", "right
safe"); |
| 152 var justifySelfLeftUnsafe = document.getElementById("justifySelfLeftUnsafe")
; |
| 153 checkValues(justifySelfLeftUnsafe, "justifySelf", "justify-self", "", "left
unsafe"); |
| 154 var justifySelfFlexStartUnsafe = document.getElementById("justifySelfFlexSta
rtUnsafe"); |
| 155 checkValues(justifySelfFlexStartUnsafe, "justifySelf", "justify-self", "", "
flex-start unsafe"); |
| 156 var justifySelfFlexEndSafe = document.getElementById("justifySelfFlexEndSafe
"); |
| 157 checkValues(justifySelfFlexEndSafe, "justifySelf", "justify-self", "", "flex
-end safe"); |
| 158 }, "Test getting justify-self set through CSS."); |
| 116 | 159 |
| 117 var justifySelfLastBaseline = document.getElementById("justifySelfLastBaseline")
; | 160 test(function() { |
| 118 shouldBe("getComputedStyle(justifySelfLastBaseline, '').getPropertyValue('justif
y-self')", "'last-baseline'"); | 161 element = document.createElement("div"); |
| 162 document.body.appendChild(element); |
| 163 checkValues(element, "justifySelf", "justify-self", "", "normal"); |
| 164 }, "Test initial value of justify-self through JS"); |
| 119 | 165 |
| 120 var justifySelfStretch = document.getElementById("justifySelfStretch"); | 166 test(function() { |
| 121 shouldBe("getComputedStyle(justifySelfStretch, '').getPropertyValue('justify-sel
f')", "'stretch'"); | 167 container = document.createElement("div"); |
| 168 element = document.createElement("div"); |
| 169 container.appendChild(element); |
| 170 document.body.appendChild(container); |
| 171 element.style.justifySelf = "center"; |
| 172 checkValues(element, "justifySelf", "justify-self", "center", "center"); |
| 122 | 173 |
| 123 var justifySelfStart = document.getElementById("justifySelfStart"); | 174 element.style.justifySelf = "unsafe start"; |
| 124 shouldBe("getComputedStyle(justifySelfStart, '').getPropertyValue('justify-self'
)", "'start'"); | 175 checkValues(element, "justifySelf", "justify-self", "start unsafe", "start
unsafe"); |
| 125 | 176 |
| 126 var justifySelfEnd = document.getElementById("justifySelfEnd"); | 177 element.style.justifySelf = "flex-end safe"; |
| 127 shouldBe("getComputedStyle(justifySelfEnd, '').getPropertyValue('justify-self')"
, "'end'"); | 178 checkValues(element, "justifySelf", "justify-self", "flex-end safe", "flex-
end safe"); |
| 128 | 179 |
| 129 var justifySelfCenter = document.getElementById("justifySelfCenter"); | 180 element.style.justifySelf = "right"; |
| 130 shouldBe("getComputedStyle(justifySelfCenter, '').getPropertyValue('justify-self
')", "'center'"); | 181 checkValues(element, "justifySelf", "justify-self", "right", "right"); |
| 131 | 182 |
| 132 var justifySelfSelfEnd = document.getElementById("justifySelfSelfEnd"); | 183 element.style.justifySelf = "center"; |
| 133 shouldBe("getComputedStyle(justifySelfSelfEnd, '').getPropertyValue('justify-sel
f')", "'self-end'"); | 184 checkValues(element, "justifySelf", "justify-self", "center", "center"); |
| 134 | 185 |
| 135 var justifySelfSelfStart = document.getElementById("justifySelfSelfStart"); | 186 element.style.justifySelf = "self-start"; |
| 136 shouldBe("getComputedStyle(justifySelfSelfStart, '').getPropertyValue('justify-s
elf')", "'self-start'"); | 187 checkValues(element, "justifySelf", "justify-self", "self-start", "self-sta
rt"); |
| 137 | 188 |
| 138 var justifySelfLeft = document.getElementById("justifySelfLeft"); | 189 element.style.justifySelf = "auto"; |
| 139 shouldBe("getComputedStyle(justifySelfLeft, '').getPropertyValue('justify-self')
", "'left'"); | 190 checkValues(element, "justifySelf", "justify-self", "auto", "normal"); |
| 140 | 191 |
| 141 var justifySelfRight = document.getElementById("justifySelfRight"); | 192 container.style.display = "flex"; |
| 142 shouldBe("getComputedStyle(justifySelfRight, '').getPropertyValue('justify-self'
)", "'right'"); | 193 element.style.justifySelf = "auto"; |
| 194 checkValues(element, "justifySelf", "justify-self", "auto", "normal"); |
| 143 | 195 |
| 144 var justifySelfFlexStart = document.getElementById("justifySelfFlexStart"); | 196 container.style.display = "grid"; |
| 145 shouldBe("getComputedStyle(justifySelfFlexStart, '').getPropertyValue('justify-s
elf')", "'flex-start'"); | 197 element.style.justifySelf = "auto"; |
| 198 checkValues(element, "justifySelf", "justify-self", "auto", "normal"); |
| 146 | 199 |
| 147 var justifySelfFlexEnd = document.getElementById("justifySelfFlexEnd"); | 200 element.style.justifySelf = "self-end"; |
| 148 shouldBe("getComputedStyle(justifySelfFlexEnd, '').getPropertyValue('justify-sel
f')", "'flex-end'"); | 201 checkValues(element, "justifySelf", "justify-self", "self-end", "self-end")
; |
| 202 }, "Test getting and setting justify-self through JS"); |
| 149 | 203 |
| 150 var justifySelfEndUnsafe = document.getElementById("justifySelfEndUnsafe"); | 204 test(function() { |
| 151 shouldBe("getComputedStyle(justifySelfEndUnsafe, '').getPropertyValue('justify-s
elf')", "'end unsafe'"); | 205 document.documentElement.style.justifySelf = "auto"; |
| 206 checkValues(document.documentElement, "justifySelf", "justify-self", "auto"
, "normal"); |
| 207 }, "Test 'auto' value resolution for the root node"); |
| 152 | 208 |
| 153 var justifySelfCenterUnsafe = document.getElementById("justifySelfCenterUnsafe")
; | 209 test(function() { |
| 154 shouldBe("getComputedStyle(justifySelfCenterUnsafe, '').getPropertyValue('justif
y-self')", "'center unsafe'"); | 210 container = document.createElement("div"); |
| 211 element = document.createElement("div"); |
| 212 container.appendChild(element); |
| 213 document.body.appendChild(container); |
| 155 | 214 |
| 156 var justifySelfSelfEndSafe = document.getElementById("justifySelfSelfEndSafe"); | 215 checkBadValues(element, "justifySelf", "justify-self", "unsafe auto"); |
| 157 shouldBe("getComputedStyle(justifySelfSelfEndSafe, '').getPropertyValue('justify
-self')", "'self-end safe'"); | 216 checkBadValues(element, "justifySelf", "justify-self", "auto safe"); |
| 217 checkBadValues(element, "justifySelf", "justify-self", "auto left"); |
| 218 checkBadValues(element, "justifySelf", "justify-self", "baseline safe"); |
| 219 checkBadValues(element, "justifySelf", "justify-self", "baseline center"); |
| 220 checkBadValues(element, "justifySelf", "justify-self", "stretch unsafe"); |
| 221 checkBadValues(element, "justifySelf", "justify-self", "stretch right"); |
| 222 checkBadValues(element, "justifySelf", "justify-self", "unsafe unsafe"); |
| 223 checkBadValues(element, "justifySelf", "justify-self", "unsafe safe"); |
| 224 checkBadValues(element, "justifySelf", "justify-self", "center start"); |
| 225 checkBadValues(element, "justifySelf", "justify-self", "stretch unsafe"); |
| 226 checkBadValues(element, "justifySelf", "justify-self", "safe stretch"); |
| 227 checkBadValues(element, "justifySelf", "justify-self", "baseline safe"); |
| 228 checkBadValues(element, "justifySelf", "justify-self", "unsafe baseline"); |
| 229 checkBadValues(element, "justifySelf", "justify-self", "unsafe safe left"); |
| 230 checkBadValues(element, "justifySelf", "justify-self", "unsafe left safe"); |
| 231 checkBadValues(element, "justifySelf", "justify-self", "left safe unsafe sa
fe"); |
| 232 checkBadValues(element, "justifySelf", "justify-self", "legacy start"); |
| 233 checkBadValues(element, "justifySelf", "justify-self", "legacy end"); |
| 234 checkBadValues(element, "justifySelf", "justify-self", "legacy right unsafe
"); |
| 235 checkBadValues(element, "justifySelf", "justify-self", "legacy auto"); |
| 236 checkBadValues(element, "justifySelf", "justify-self", "legacy stretch"); |
| 237 checkBadValues(element, "justifySelf", "justify-self", "legacy"); |
| 238 checkBadValues(element, "justifySelf", "justify-self", "legacy left right")
; |
| 239 }, "Test bad combinations of justify-self"); |
| 158 | 240 |
| 159 var justifySelfSelfStartSafe = document.getElementById("justifySelfSelfStartSafe
"); | 241 test(function() { |
| 160 shouldBe("getComputedStyle(justifySelfSelfStartSafe, '').getPropertyValue('justi
fy-self')", "'self-start safe'"); | 242 container.style.display = ""; |
| 243 checkInitialValues(element, "justifySelf", "justify-self", "center", "normal
"); |
| 244 }, "Test the value 'initial'"); |
| 161 | 245 |
| 162 var justifySelfRightSafe = document.getElementById("justifySelfRightSafe"); | 246 test(function() { |
| 163 shouldBe("getComputedStyle(justifySelfRightSafe, '').getPropertyValue('justify-s
elf')", "'right safe'"); | 247 container.style.display = "grid"; |
| 248 checkInitialValues(element, "justifySelf", "justify-self", "left safe", "nor
mal"); |
| 249 }, "Test the value 'initial' for grid containers"); |
| 164 | 250 |
| 165 var justifySelfLeftUnsafe = document.getElementById("justifySelfLeftUnsafe"); | 251 test(function() { |
| 166 shouldBe("getComputedStyle(justifySelfLeftUnsafe, '').getPropertyValue('justify-
self')", "'left unsafe'"); | 252 container.style.display = "flex"; |
| 253 checkInitialValues(element, "justifySelf", "justify-self", "right unsafe", "
normal"); |
| 254 }, "Test the value 'initial' for flex containers"); |
| 167 | 255 |
| 168 var justifySelfFlexStartUnsafe = document.getElementById("justifySelfFlexStartUn
safe"); | 256 test(function() { |
| 169 shouldBe("getComputedStyle(justifySelfFlexStartUnsafe, '').getPropertyValue('jus
tify-self')", "'flex-start unsafe'"); | 257 container.style.display = ""; |
| 258 element.style.position = "absolute"; |
| 259 checkInitialValues(element, "justifySelf", "justify-self", "left", "normal")
; |
| 260 }, "Test the value 'initial' for positioned elements"); |
| 170 | 261 |
| 171 var justifySelfFlexEndSafe = document.getElementById("justifySelfFlexEndSafe"); | 262 test(function() { |
| 172 shouldBe("getComputedStyle(justifySelfFlexEndSafe, '').getPropertyValue('justify
-self')", "'flex-end safe'"); | 263 container.style.display = "grid"; |
| 264 element.style.position = "absolute"; |
| 265 checkInitialValues(element, "justifySelf", "justify-self", "right", "normal"
); |
| 266 }, "Test the value 'initial' for positioned elements in grid containers"); |
| 173 | 267 |
| 174 debug(""); | 268 test(function() { |
| 175 debug("Test initial value of justify-self through JS"); | 269 container.style.display = "flex"; |
| 176 element = document.createElement("div"); | 270 element.style.position = "absolute"; |
| 177 document.body.appendChild(element); | 271 checkInitialValues(element, "justifySelf", "justify-self", "end", "normal"); |
| 178 shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'nor
mal'"); | 272 }, "Test the value 'initial' for positioned elements in grid containers"); |
| 179 | 273 |
| 180 debug(""); | 274 test(function() { |
| 181 debug("Test getting and setting justify-self through JS"); | 275 checkInheritValues("justifySelf", "justify-self", "end"); |
| 182 container = document.createElement("div"); | 276 checkInheritValues("justifySelf", "justify-self", "left safe"); |
| 183 element = document.createElement("div"); | 277 checkInheritValues("justifySelf", "justify-self", "center unsafe"); |
| 184 container.appendChild(element); | 278 }, "Test the value 'inherit'"); |
| 185 document.body.appendChild(container); | |
| 186 element.style.justifySelf = "center"; | |
| 187 checkValues(element, "justifySelf", "justify-self", "center", "center"); | |
| 188 | |
| 189 element.style.justifySelf = "unsafe start"; | |
| 190 checkValues(element, "justifySelf", "justify-self", "start unsafe", "start unsa
fe"); | |
| 191 | |
| 192 element.style.justifySelf = "flex-end safe"; | |
| 193 checkValues(element, "justifySelf", "justify-self", "flex-end safe", "flex-end
safe"); | |
| 194 | |
| 195 element.style.justifySelf = "right"; | |
| 196 checkValues(element, "justifySelf", "justify-self", "right", "right"); | |
| 197 | |
| 198 element.style.justifySelf = "center"; | |
| 199 checkValues(element, "justifySelf", "justify-self", "center", "center"); | |
| 200 | |
| 201 element.style.justifySelf = "self-start"; | |
| 202 checkValues(element, "justifySelf", "justify-self", "self-start", "self-start")
; | |
| 203 | |
| 204 element.style.justifySelf = "auto"; | |
| 205 checkValues(element, "justifySelf", "justify-self", "auto", "normal"); | |
| 206 | |
| 207 container.style.display = "flex"; | |
| 208 element.style.justifySelf = "auto"; | |
| 209 checkValues(element, "justifySelf", "justify-self", "auto", "normal"); | |
| 210 | |
| 211 container.style.display = "grid"; | |
| 212 element.style.justifySelf = "auto"; | |
| 213 checkValues(element, "justifySelf", "justify-self", "auto", "normal"); | |
| 214 | |
| 215 element.style.justifySelf = "self-end"; | |
| 216 checkValues(element, "justifySelf", "justify-self", "self-end", "self-end"); | |
| 217 | |
| 218 debug(""); | |
| 219 debug("Test 'auto' value resolution for the root node"); | |
| 220 document.documentElement.style.justifySelf = "auto"; | |
| 221 checkValues(document.documentElement, "justifySelf", "justify-self", "auto", "n
ormal"); | |
| 222 | |
| 223 debug(""); | |
| 224 debug("Test bad combinations of justify-self"); | |
| 225 container = document.createElement("div"); | |
| 226 element = document.createElement("div"); | |
| 227 container.appendChild(element); | |
| 228 document.body.appendChild(container); | |
| 229 | |
| 230 checkBadValues(element, "justifySelf", "justify-self", "unsafe auto"); | |
| 231 checkBadValues(element, "justifySelf", "justify-self", "auto safe"); | |
| 232 checkBadValues(element, "justifySelf", "justify-self", "auto left"); | |
| 233 checkBadValues(element, "justifySelf", "justify-self", "baseline safe"); | |
| 234 checkBadValues(element, "justifySelf", "justify-self", "baseline center"); | |
| 235 checkBadValues(element, "justifySelf", "justify-self", "stretch unsafe"); | |
| 236 checkBadValues(element, "justifySelf", "justify-self", "stretch right"); | |
| 237 checkBadValues(element, "justifySelf", "justify-self", "unsafe unsafe"); | |
| 238 checkBadValues(element, "justifySelf", "justify-self", "unsafe safe"); | |
| 239 checkBadValues(element, "justifySelf", "justify-self", "center start"); | |
| 240 checkBadValues(element, "justifySelf", "justify-self", "stretch unsafe"); | |
| 241 checkBadValues(element, "justifySelf", "justify-self", "safe stretch"); | |
| 242 checkBadValues(element, "justifySelf", "justify-self", "baseline safe"); | |
| 243 checkBadValues(element, "justifySelf", "justify-self", "unsafe baseline"); | |
| 244 checkBadValues(element, "justifySelf", "justify-self", "unsafe safe left"); | |
| 245 checkBadValues(element, "justifySelf", "justify-self", "unsafe left safe"); | |
| 246 checkBadValues(element, "justifySelf", "justify-self", "left safe unsafe safe")
; | |
| 247 checkBadValues(element, "justifySelf", "justify-self", "legacy start"); | |
| 248 checkBadValues(element, "justifySelf", "justify-self", "legacy end"); | |
| 249 checkBadValues(element, "justifySelf", "justify-self", "legacy right unsafe"); | |
| 250 checkBadValues(element, "justifySelf", "justify-self", "legacy auto"); | |
| 251 checkBadValues(element, "justifySelf", "justify-self", "legacy stretch"); | |
| 252 checkBadValues(element, "justifySelf", "justify-self", "legacy"); | |
| 253 checkBadValues(element, "justifySelf", "justify-self", "legacy left right"); | |
| 254 | |
| 255 debug(""); | |
| 256 debug("Test the value 'initial'"); | |
| 257 container.style.display = ""; | |
| 258 checkInitialValues(element, "justifySelf", "justify-self", "center", "normal"); | |
| 259 | |
| 260 debug(""); | |
| 261 debug("Test the value 'initial' for grid containers"); | |
| 262 container.style.display = "grid"; | |
| 263 checkInitialValues(element, "justifySelf", "justify-self", "left safe", "normal"
); | |
| 264 | |
| 265 debug(""); | |
| 266 debug("Test the value 'initial' for flex containers"); | |
| 267 container.style.display = "flex"; | |
| 268 checkInitialValues(element, "justifySelf", "justify-self", "right unsafe", "norm
al"); | |
| 269 | |
| 270 debug(""); | |
| 271 debug("Test the value 'initial' for positioned elements"); | |
| 272 container.style.display = ""; | |
| 273 element.style.position = "absolute"; | |
| 274 checkInitialValues(element, "justifySelf", "justify-self", "left", "normal"); | |
| 275 | |
| 276 debug(""); | |
| 277 debug("Test the value 'initial' for positioned elements in grid containers"); | |
| 278 container.style.display = "grid"; | |
| 279 element.style.position = "absolute"; | |
| 280 checkInitialValues(element, "justifySelf", "justify-self", "right", "normal"); | |
| 281 | |
| 282 debug(""); | |
| 283 debug("Test the value 'initial' for positioned elements in grid containers"); | |
| 284 container.style.display = "flex"; | |
| 285 element.style.position = "absolute"; | |
| 286 checkInitialValues(element, "justifySelf", "justify-self", "end", "normal"); | |
| 287 | |
| 288 debug(""); | |
| 289 debug("Test the value 'inherit'"); | |
| 290 checkInheritValues("justifySelf", "justify-self", "end"); | |
| 291 checkInheritValues("justifySelf", "justify-self", "left safe"); | |
| 292 checkInheritValues("justifySelf", "justify-self", "center unsafe"); | |
| 293 | |
| 294 </script> | 279 </script> |
| 295 </body> | |
| 296 </html> | |
| OLD | NEW |