Require label for attribute to reference a labelable form control

Rule ID:

valid-for

Category:

Document

Standards:

• HTML5

The <label> element's for attribute must reference a labelable form control.

According to the HTML specification, the for attribute should reference elements that can be labeled, such as:

• <input> (except type="hidden")
• <textarea>
• <select>
• <button>
• <output>
• <meter>
• <progress>

Rule details

Examples of incorrect code for this rule:

<label for="foo">Lorem ipsum</label>
<p id="foo">dolor sit amet</p>

error: <label> "for" attribute must reference a labelable form control (valid-for) at inline:1:13:
> 1 | <label for="foo">Lorem ipsum</label>
    |             ^^^
  2 | <p id="foo">dolor sit amet</p>


1 error found.

Examples of correct code for this rule:

<label for="foo">Lorem ipsum</label>
<input type="text" id="foo">

Version history

• 10.6.0 - Rule added.