<!DOCTYPE html>
<meta charset="utf-8">
<link rel="help" href="https://html.spec.whatwg.org/#tables-2:presentational-hints">
<link rel="help" href="https://drafts.csswg.org/selectors-4/#attribute-case">
<meta name="assert" content="non-standard @valign values on table-related elements are ASCII case-insensitive">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<!--
Blink treats <foo valign="absmiddle"> as the same as <foo valign="middle">,
but the specification only mentions top, middle, bottom, and baseline.
-->
<table><tr><td valign="absmiddle">X</table>
<table><tr><td valign="AbSMiDdLe">X</table>
<table><tr><td valign="abſmiddle">X</table>
<script>
const td = document.querySelectorAll("td");
test(() => {
assert_equals(getComputedStyle(td[0]).getPropertyValue("vertical-align"), "middle");
// vacuous: the default is currently middle [#tables-2], so even if the UA
// treats this as invalid, the observable behaviour would still be correct
assert_equals(getComputedStyle(td[1]).getPropertyValue("vertical-align"), "middle");
// vacuous: the default is currently middle [#tables-2], so even if the UA
// treats this as valid, the observable behaviour would still be correct
assert_equals(getComputedStyle(td[2]).getPropertyValue("vertical-align"), "middle");
}, "keyword absmiddle");
</script>