Test page for titledesc, a polyfill for whatwg/html#4596

Legend:

x-title is rendered bold
x-desc is rendered in italics
elements with an aria-labelledby attribute have a dotted deepink border
elements with an aria-describedby attribute have a dashed cyan outline

Ideal usage in a world with full browser support

labelled div

described div

Basic usage, with proper fallbacks for when JS doesn't load

labelled div

described div

Multiple titles and descriptions

label 1

label 2

label 3

label 4

description 1

description 2

description 3

description 4

Mixed usage

non x-title label

x-title label

non x-desc description

x-desc description

Using `hidden`

title and description are hidden.

Using `for` attribute to add description to form element

checkbox label (not x-title)

a description of this checkbox

Empty attributes

empty id attribute

empty for attribute

Incorrect `for` attribute

no such id

id is same as for

Title removed by javascript

all is impermanent

x-title element was removed.

Title added by javascript

Title reparented by javascript

label

originally titled container