WebAIM - Web Accessibility In Mind

E-mail List Archives

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

for

From: Steve Green
Date: Sep 29, 2010 11:18AM

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!