Can the labels of an attribute be associated with a normal div?


is it valid html under html5 definitions to use a label's "for" value as an id of a normal div element (for example I have made a custom dropdown list implementation which is encased inside a div)

Please let me know if possible,


Not according to the spec:

Some elements, not all of them form-associated, are categorized as labelable elements. These are elements that can be associated with a label element.

"button" "input" (if the type attribute is not in the hidden state) "keygen" "meter" "output" "progress" "select" "textarea"

See also:

The for attribute may be specified to indicate a form control with which the caption is to be associated. If the attribute is specified, the attribute's value must be the ID of a labelable element in the same Document as the label element. If the attribute is specified and there is an element in the Document whose ID is equal to the value of the for attribute, and the first such element is a labelable element, then that element is the label element's labeled control.

I do think the question presents a valid use case. I'm not sure what the recommended pattern is for such a scenario, though ARIA attributes might help to make the markup more accessible: