On Nov 5, 2008, at 12:15 AM, wlb wrote:

> These button work fine in the latest versions of Safari Explorer,  
> Opera, and
> Chrome on both Windows and Mac, but the latest versions of Firefox  
> on both
> Mac and Win produce long blue and red lines projecting off to the  
> left side
> of the display when they are clicked. It must be a CSS problem, but  
> I can't
> figure out what. I'm surprised since Firefox is supposed to be so  
> savvy with
> CSS.
>
> Here is the URL:
> http://www.boletta.com/aau/

That blue/red lines are focussing rings, indicating that the link is  
focused; Gecko (Firefox) is well within the spec here,. The outline  
wraps around the overflowed area of your link, caused by the negative  
text-indent (on #nav li).

[EMAIL PROTECTED] answered

> Add this to your style sheet -
>
> *:focus { outline: 0; }*

I assume that asterix at the end of the line is a typing error on your  
part…
Anyway, that is not such a bright idea, as it takes away any  
indication to keyboard users that the link has been focussed. Unless  
you also add other, carefully considered, stylistic indications that  
the link has been focussed.

A better solution for that case is to declare:

        #nav li a {overflow:hidden}

That will contain the focus ring within the box.

(corrected the obvious typo in the subject of this mail, that may help  
people who search the archives)

Philippe
---
Philippe Wittenbergh
http://l-c-n.com/





______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to