validating HTML: The for attribute of the label element must refer to a form control

StackOverflow https://stackoverflow.com/questions/18945774

  •  29-06-2022
  •  | 
  •  

Question

I don't know why I keep getting this error while checking my page at http://validator.w3.org/check The error was:

Line 235, Column 84: The for attribute of the label element must refer to a form control.
… <label for="name" style="line-height:24px;">Your Name</label><br>&nbsp;&nbsp;

here is my actual code

<div>&nbsp;&nbsp;
  <label for="name" style="line-height:24px;">Your Name</label><br>&nbsp;&nbsp;
  <input class="css_form_namefield TooltipIstok " type="text" name="name" value="" style="width: 554px;" maxlength="50" >
</div>
Was it helpful?

Solution

If you use the for attribute in a label element it has to match the id of an input element in your form.

ie

<label for="field-id" style="line-height:24px;">Your Name</label><br>&nbsp;&nbsp;
<input type="text" id="field-id">

This page may be helpful for more information. http://www.w3.org/TR/WCAG-TECHS/H44.html

OTHER TIPS

By definition, the for attribute value must match the id attribute value of “another” form control, to use the HTML 4.01 terminology. Controls are created by input, textarea, button, select, or object elements, so just read “another” as “a”. HTML5 puts this somewhat differently, specifying that the attribute must refer to a labelable element.

From the error message, it seems that you are validating against HTML5, so the rule that applies is that the for attribute must refer to a button, input (other than with type=hidden), keygen, meter, output, progress, select, or textarea element. My guess is that you just forgot the id attribute, incorrectly assuming that the name attribute could do its job.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top