514720 - legend cannot be repositioned

Status: RESOLVED DUPLICATE of bug 269908

(Core :: Layout: Form Controls, defect)

Description

[Grant Husbands]

User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 6.1; en-GB; rv:1.9.1.2) Gecko/20090729 Firefox/3.5.2
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 6.1; en-GB; rv:1.9.1.2) Gecko/20090729 Firefox/3.5.2

You can't alter a legend's position, as the built-in stylesheet has many !important rules that prevent that. The testcase works in Chrome and IE. The technique can be useful for improving accessibility for those who use screen readers.

It's something like this:
<fieldset><legend style="position:absolute;left:-1000em">For screen readers only</legend>Stuff</fieldset>

Reproducible: Always

Steps to Reproduce:
Visit testcase at http://download.firmstep.com/files/fieldset.html
Actual Results:  
Legend appears on-screen

Expected Results:  
Legend not appearing

I've found that font-size:0 has the desired effect, as long as screen readers still read it.

Comment 1

[Boris Zbarsky [:bzbarsky]]

I question the value here as an accessibility approach, since the legend will appear in more than just screen readers.  But in any case, this bug will be fixed in Gecko 1.9.2.

Comment 2

[Grant Husbands]

(In reply to comment #1)
> I question the value here as an accessibility approach, since the legend will
> appear in more than just screen readers.

Sorry the dupe. 

I hope it's not bad form to post this question here, but:
To what else are you referring?

As an aside, I'm not sure what else one can do for screen readers; they don't offer a detection method and they have modes in which they only read field labels and surrounding fieldset legends. That doesn't leave many options for making a nicely styled set of accessible checkboxes.

Comment 3

[Boris Zbarsky [:bzbarsky]]

Text-only browsers, for example.  Search engines...  Anything that doesn't really do CSS.

Not sure why you need to hide the legend to do "nicely styled".  ;)