WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Hiding Legends

for

From: Moore, Michael
Date: Oct 15, 2008 3:20PM

I have found that the best way to overcome styling problems with legends
is to place the content for the legend inside of a span then do what you
want with the span.

<legend><span class="fixLegend">My content here</span></legend>

I have tested this method with FireFox, IE and Opera but not Safari, and
found that it helps resolve positioning and wrapping issues with
legends.

Mike Moore

-----Original Message-----
From: <EMAIL REMOVED>
[mailto: <EMAIL REMOVED> ] On Behalf Of Dean Hamack
Sent: Wednesday, October 15, 2008 4:08 PM
To: WebAIM Discussion List
Subject: Re: [WebAIM] Hiding Legends

I'm having the issue in Firefox. Works fine in Safari. Haven't looked at
IE.


On 10/15/08 2:04 PM, "Tim Beadle" < <EMAIL REMOVED> > wrote:

> On Wed, Oct 15, 2008 at 9:48 PM, Dean Hamack < <EMAIL REMOVED> >
wrote:
>> Working on a form now and am having trouble hiding the legend. I have
it set
>> up in the usual way:
>>
>> legend {position:absolute;left:0px;top:-500px;height:1px;
>> font-size:1px;overflow:hidden}
>>
>> It's 1 pixel tall, but it's staying right where it is and it's
visible on
>> screen.
>>
>> Are there known issues with legends?
>
> Which browser? IE in particular has trouble styling legends, from
experience.
>
> Tim
>