WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Firefox vs. IE - dotted outline to show element in focus

for

From: Amanda Nance
Date: Sep 29, 2010 11:24AM

Jukka, I can't post the URL because it's only available inside our network.

I see that the <LI> has "outline-style: none". I'm assuming that's what
Steve is referring to.

Thanks Steve!

On Wed, Sep 29, 2010 at 1:13 PM, Steve Green < <EMAIL REMOVED> >wrote:

> The problem will be that the 'outline' styles are set to 'none' or '0' in
> your stylesheet. New browsers such as Firefox honour this rule and do not
> display the outline. Older browsers do not honour the rule so they display
> the outline.
>
> We see this problem on almost every website that we test, and it is because
> developers use Eric Meyer's reset stylesheet, which sets the 'outline'
> properties to 'none' or '0' as appropriate. The reset stylesheet includes a
> warning that you must set your own values for these properties, but almost
> no one does.
>
> You should either set values for the 'outline' properties or delete those
> rules from the stylesheet.
>
> Steve Green
> Director
> Test Partners Ltd
>
>
> -----Original Message-----
> From: <EMAIL REMOVED>
> [mailto: <EMAIL REMOVED> ] On Behalf Of Amanda Nance
> Sent: 29 September 2010 17:59
> To: WebAIM Discussion List
> Subject: [WebAIM] Firefox vs. IE - dotted outline to show element in focus
>
> Hi all,
> I am doing accessibility testing, but I'm not a developer. We have a
> navigation bar with tabs... When focus is on a tab, I see the dotted
> outline
> in IE but not in Firefox. Is there an easy way to code it so that the
> outline appears in both browsers? Here is how it's currently coded:
>
> <li><a href="">Name of tab<br/><span>Subname of tab</span></a></li>
>
> Thanks!
>