Implicit labels The input element is a labeled control of the label element (implicit label). Therefore the label element is a programmatic label of the input element. Explicit labels The input element is a labeled control of the label element (explicit label). Therefore the label element is a programmatic label of the input element. Aria-labelledby, single reference The span element is referenced by the aria-labelledby attribute on the input element. Therefore, the span element is a programmatic label of the input element. Full name: Aria-labelledby, multiple references Both span elements are referenced by the aria-labelledby attribute on the input element. Therefore, each span element is a programmatic label of the input element. Billing address Conflicting label methods The span element is referenced by the aria-labelledby attribute on the input element and the input element is a labeled control of the label. Therefore, the span element and the label are each a programmatic label of the input element. Full name: Full name c: Full name d: Full name e: Full name f: Invalid label for attribute The div element is not labelable. Therefore, it is not a labeled control for the label element and the label element is not a programmatic label for the div element.
My name is Bond. James Bond.
aria-labelledby on div The span element is referenced by the aria-labelledby attribute on the div element. Therefore, the span element is a programmatic label of the div element. Note that the aria-labelledby attribute works on any element, not just on the labelable elements. Full name:
My name is Bond. James Bond.
Shadow DOM Test 1
Shadow DOM Test 2
Shadow DOM Test 3
Shadow DOM Test 4
Shadow DOM Test 5
Shadow DOM Test 6
Shadow DOM Test 7
Shadow DOM Test 8
Shadow DOM Test 9
Shadow DOM Test 10
Shadow DOM Test 11