label-that-names-nothing

This fails the run. Where it is wrong about your code, // ramonda-check-ignore <reason> on the line says so, and the reason is printed on every run.

Reported when a <label> has no htmlFor and no control inside it, so it labels nothing.

A label is an association, not styled text, and HTML gives it two ways to make one: htmlFor naming a control's id, or the control written inside it.

<label htmlFor="email">Email</label>
<input id="email" type="email" />

or, with no id to keep in step:

<label>Email <input type="email" /></label>

With neither, two things are lost. The control has no accessible name, so a screen reader announces "edit, blank" and stops. And clicking the text no longer focuses the field — the affordance everybody uses without thinking about it, and the one that makes a form usable for somebody with a tremor.

If the text really is not a caption for anything, it is not a label: use a <span>, or a <legend> if it heads a <fieldset>.

Next

• All rules — the other checks this one runs beside.
• Checking your app — how to run it, and what it proves.