- From: Paul Collins <paul@pokelondon.com>
- Date: Thu, 21 Sep 2006 16:42:03 +0100
- To: "Paul Collins" <pauldcollins@gmail.com>, <jim@jimthatcher.com>
- Cc: "Michael S Elledge" <elledge@msu.edu>, <w3c-wai-ig@w3.org>
- Message-ID: <01bf01c6dd94$7f4f0060$a318a8c0@dev2>
There was a typo there too, they should both say "firstField" ----- Original Message ----- From: Paul Collins To: jim@jimthatcher.com Cc: Michael S Elledge ; w3c-wai-ig@w3.org Sent: Thursday, September 21, 2006 4:34 PM Subject: Re: a single label where multiple fields follow Yes, that was my mistake thanks Jim and I have learnt something today :) Curious to know and I may be wrong again here, what are the implications of applying a label that is associated with the first input only, so long as the inputs are inside a fieldset together? EG: <fieldset> <label for="firstField">Select your choice</label> <input type="text" id="firstChoice"> <input type="text"> <input type="text"> </fieldset> Hope I am not going down the wrong path here again :) On 21/09/06, Jim Thatcher <jim@jimthatcher.com> wrote: > > Michael, that's a good technique too. Strange thing is that class "hidden" > could also be display:none. Turns out that screen readers ignore > display:none content, as I think they should, except when it is in a label > element! > > By the way, in a previous post, I wrongly attributed code where the labele > element contained three inputs to David Dorward - it was not his, it was > Paul Collins'. > > Jim > > Accessibility Consulting: http://jimthatcher.com/ > 512-306-0931 > > -----Original Message----- > From: w3c-wai-ig-request@w3.org [mailto:w3c-wai-ig-request@w3.org] On Behalf > Of Michael S Elledge > Sent: Thursday, September 21, 2006 9:42 AM > To: Terrence Wood > Cc: w3c-wai-ig@w3.org; Antony Tennant > Subject: Re: a single label where multiple fields follow > > > I suspect I may get some critical responses... > :-) > > however, where the input fields are self-evident to sighted users (such > as for month/day/year drop downs) but still useful for screen reader > users, you can consider moving labels off screen using CSS. That way you > have the benefit of providing additional context without relying solely > on title tags or causing unnecessary screen clutter: > > <fieldset> > <legend>Dates for Stay:</legend> > Check in: > <label for="CheckInMonth" class="hidden">Check in month: > </label><br /> > <select name="monIn" id="CheckInMonth" title="Check in > Month"> > <option value="1">Jan</option> > <option value="2">Feb</option> > </select> > > <label for="CheckInDay" class="hidden">Check in day: > </label> > <select name="dayIn" id="CheckInDay" title="Check in Day"> > <option value="1">1</option> > <option value="2">2</option> > <option value="25">25</option> > </select> > > <label for="CheckInYear" class="hidden">Check in year: > </label> > <select name="yearIn" id="CheckInYear" title="Check in > Year"> > <option value="2006">2006</option> > <option value="2007">2007</option> > </select><br /><br /> > > Check out: <br /> > <label for="CheckOutMonth" class="hidden">Check out > month: </label> > <select name="monOut" id="CheckOutMonth" title="Check > Out Month"> > <option value="1">Jan</option> > <option value="2">Feb</option> > </select> > > <label for="CheckOutDay" class="hidden">Check out day: > </label> > <select name="dayOut" id="CheckOutDay" title="Check Out > Day"> > <option value="1">1</option> > <option value="2">2</option> > <option value="27">27</option> > </select> > > <label for="CheckOutYear" class="hidden">Check out year: > </label> > <select name="yearOut" id="CheckOutYear" title="Check > Out Year"> > <option value="2006">2006</option> > <option value="2007">2007</option> > </select><br /> > </fieldset> > > .hidden { > position: absolute; > left: -500px; > top: -500px; > } > > Mike > > Terrence Wood wrote: > > > > > > On 22/09/2006, at 12:43 AM, Antony Tennant wrote: > >> I would like to get some opinions on the best practise for assigning > >> <label for""> to inputs where there are multiple inputs > > > > Labels relate to one control only, however, a control can have > > multiple labels. > > > > Group related controls together using fieldset and legend. > > > > Telephone Example (inputs omitted for brevity) > > > > <fieldset><legend>Telephone number</legend> > > <label for="countrycode">... > > <label for="areacode">... > > <label for="number">... > > </fieldset> > > > > > > > > kind regards > > Terrence Wood. > > > > > > > > > > > > -- ----------------------------------------------- Paul Collins Ph: +44 (0) 793 9038 249 (UK) pauldcollins@gmail.com
Received on Thursday, 21 September 2006 15:42:25 UTC