HTML Checking for Large Sites
Rocket Validator integrates the W3C Validator HTML checker into an automated web crawler.
When nesting a select
element inside a label
that has a for
attribute, the id
attribute of the select
is required to match it.
The label
element represents a caption in a user interface. The caption can be associated with a specific form control, known as the label element’s labeled control, either using the for
attribute, or by putting the form control inside the label
element itself.
When the select is inside the label
, there’s no need to specify a for
attribute as there can only be one select
, as in this example:
<label>
Age
<select>
<option>young</option>
<option>old</option>
</select>
</label>
However, if the for
attribute is specified, then it must match the id
of the select
like this:
<label for="age">
Age
<select id="age">
<option>young</option>
<option>old</option>
</select>
</label>
Learn more:
Related W3C validator issues
When nesting an input element inside a label that has a for attribute, the id attribute of the input is required to match it.
The label element represents a caption in a user interface. The caption can be associated with a specific form control, known as the label element’s labeled control, either using the for attribute, or by putting the form control inside the label element itself.
When the input is inside the label, there’s no need to specify a for attribute as there can only be one input, as in this example:
<label>
Age
<input type="text" name="age">
</label>
However, if the for attribute is specified, then it must match the id of the input like this:
<label for="user_age">
Age
<input type="text" name="age" id="user_age">
</label>
The <label> element represents a caption in a document, and it can be associated with a form input using the for attribute, which must be an ID. Document IDs cannot contain whitespace.
Example:
<form>
<label for="user_name">Name</label>
<input type="text" id="user_name" />
</form>
Drop-down lists can be defined in HTML by using the <select> tag, containing the different <option>s. Each <option> must have a name, which can be either contained between <option> and </option>, or alternatively using the label attribute.
Example:
<select name="size">
<option value="s">small</option>
<option value="m" label="medium"></option>
</select>
<label> tags are used to label inputs in form, which need to be present and visible in the document, for example:
<label for="age">Age</label>
<input id="age" />
Still checking your large sites one page at a time?
Save time using our automated web checker. Let our crawler check your web pages on the W3C Validator.
The multiple attribute is used to indicate that multiple options can be selected in a <select> element. As a boolean attribute, it should only be declared without any value.
Instead of:
<select multiple="true">
You should use:
<select multiple>
Here is an example of the correct usage of the multiple attribute:
<label for="colors">Select your favorite colors:</label>
<select id="colors" name="colors" multiple>
<option value="red">Red</option>
<option value="green">Green</option>
<option value="blue">Blue</option>
<option value="yellow">Yellow</option>
</select>
The label element may only contain one labelable descendant.
For example:
<label for="age">
Age
<select id="age">
<option>young</option>
<option>old</option>
</select>
</label>
Still checking your large sites one page at a time?
Save time using our automated web checker. Let our crawler check your web pages on the W3C Validator.
A <label> tag can’t be used inside an <a> tag. Consider using other tags like <span>.
A label element is not allowed as a descendant of a button element.
The label element represents a caption in a user interface. The caption can be associated with a specific form control, known as the label element’s labeled control, either using the for attribute, or by putting the form control inside the label element itself.
A <label> element cannot contain other <label> as a descendant. Check for nested elements or closing tags that may have been misinterpreted, for example:
<label>name</label></label>
<select> elements that are required and are not multiple need a placeholder option that has no value, for example:
<select required>
<option value="">choose size</option>
<option value="s">small</option>
<option value="l">large</option>
</select>
Still checking your large sites one page at a time?
Save time using our automated web checker. Let our crawler check your web pages on the W3C Validator.