Using "label for" on radio buttons

html radio-button label section508
Wilkie picture Wilkie · Oct 6, 2009 · Viewed 188.2k times · Source

When using the "label for" parameter on radio buttons, to be 508 compliant*, is the following correct?

 <label for="button one"><input type="radio" name="group1" id="r1" value="1" /> button one</label>

or is this?

 <input type="radio" name="group1" id="r1" value="1" /><label for="button one"> button one</label>

Reason I ask is that in the second example, "label" is only encompassing the text and not the actual radio button.

*Section 508 of the Rehabilitation Act of 1973 requires federal agencies to provide software and website accessibility to people with disabilities.

Answer

Marc W picture Marc W · Oct 6, 2009

You almost got it. It should be this:

<input type="radio" name="group1" id="r1" value="1" />
<label for="r1"> button one</label>

The value in for should be the id of the element you are labeling.

Related questions

Tab Index on div

Please see the form HTML code below <form method="post" action="register"> <div class="email"> Email <input type="text" tabindex="1" id="email" value="" name="email"> </div> </div> <div class="…

Read More
How can I know which radio button is selected via jQuery?

I have two radio buttons and want to post the value of the selected one. How can I get the value with jQuery? I can get all of them like this: $("form :radio") How do I know which one is …

Read More
How to select a radio button by default?

I have some radio buttons and I want one of them to be set as selected by default when the page is loaded. How can I do that? <input type="radio" name="imgsel" value="" />

Read More