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 46, Column 68: The for attribute of the label element must refer to a form control. 
<label class="environment-label" for="environment_form">Environments:</label>

I believe I provided an id reference for my label to the outer form, why it keep bugging me about this error?

<div>
    <form id="environment_form" method="post">
        <div class="styled-select">
            <label class="environment-label" for="environment_form">Environments:</label>
            <select name="environment_dropdown" onchange="selectionChanged()">
                <option @(ViewData["selection"] == null || string.IsNullOrEmpty(ViewData["selection"].ToString()) ? "selected" : "")>select one</option>
                @foreach (string name in Model) { 
                    <option @(ViewData["selection"] != null && ViewData["selection"].Equals(name) ? "selected" : "")> 
                        @name
                    </option>
                }
            </select> 
        </div>
    </form>
</div>

Answer 1

you have this :

for="environment_form"

and it refers to the form directly ! But the “for” attribute should refer to an element of your form, in your case to the select. So add an “id” attribute to your select and change the “for”, like this fo example :

<label class="environment-label" for="environment_dropdown">Environments:</label>
<select name="environment_dropdown" id="environment_dropdown" onchange="selectionChanged()">