349449 - Dotted border outline on active links

Status: RESOLVED DUPLICATE of bug 418521

(Core :: Layout, defect)

Description

[Sean]

User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.0.6) Gecko/20060728 Firefox/1.5.0.6
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.0.6) Gecko/20060728 Firefox/1.5.0.6

This is more a feature request than a bug.  In Firefox the default method of displaying the :focus psuedo-class causes certain buttons and clickable images to look ugly when clicked.  I think this is one of the few things that is implemented better in Internet Explorer 6 than in Firefox. With IE6, the dotted border focus only shows up when you start tabbing through to select things. It remains hidden until the tab key is pressed. This is the best approach, since it won't screw up the way a site looks for those who don't need it, but for people who like to navigate with the keyboard, it becomes available.  Here is the code for a button to demonstrate what I am talking about:

[code]<input type="submit" style="text-align:center;background-position:bottom left;width:180px;height:35px;cursor:pointer;border:none;font-weight:bold;font-family:inherit;background: url('http://www.fullersfineherbs.com/components/com_virtuemart/shop_image/ps_image/add-to-cart_brown.gif') no-repeat left center transparent;vertical-align: middle;" value="Add to Cart" title="Add to Cart" />[/code]

Reproducible: Always

Comment 1

[Adam Guthrie]

I'm pretty sure we do this for a11y reasons and that this is a WONTFIX.

Comment 2

[Cleo Huggins]

I and probably ever designer I know agree with Sean.

Another instance where this "feature" kills the asthetics of the navigation is for pages that have to rely on image map links. See article in A List apart: (ALa:166). (http://www.alistapart.com/d/imagemap/example2.html) (At least this guy's design is darkish so the ugly box doesn't show up as much). It just looks like a mistake that the designer didn't know how to fix. 

As long as there are alternative solutions for accessibility I don't see a reason to handicap designers. 

Comment 3

[Martijn Wargers (dead)]

(In reply to comment #2)
> As long as there are alternative solutions for accessibility I don't see a
> reason to handicap designers. 

Designers aren't handicapped, they can disable the outline by using something like -moz-outline: 0px; for example.

Comment 4

[Daniel.S]

(In reply to comment #3)
> Designers aren't handicapped, they can disable the outline by using something
> like -moz-outline: 0px; for example.

I don't think authors should include this rule. They disable the outline for everyone, even those who may need it.

If a user doesn't like this, he can set it in userChrome.css or in about:config by setting browser.display.focus_ring_width to 0.

Otehrwise, this bug a dupe of bug 418521.