Results 1 to 8 of 8

Thread: The dotted gray border around active links in Firefox

  1. #1
    Join Date
    Aug 2007
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question The dotted gray border around active links in Firefox

    Hello All,
    I've tried modifying many different link styles to get rid of the dotted gray border that appears around active links in Firefox, but to no avail.

    I've applied
    border: 0px;
    text-decoration: none;

    to the link, visited, hover, active, and focus properties of the links in question.

    Does anyone have any ideas?

    I don't have this particular problem in Internet Explorer.

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    That's really an accessibility feature for the mouse impaired, so you should just leave it alone. However, I realize it looks bad and that it should probably be done the way it is in other browsers. In other browsers, it only appears if you start using the keyboard to cycle through the links.

    Anyways, if you just can't live with it:

    Code:
    outline-style:none;
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. #3
    Join Date
    Aug 2007
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Thanks!

    Thanks very much for both the background and the fix. I don't mind it now that I know what it is : ).

  4. #4
    Join Date
    May 2007
    Posts
    28
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    I don't think there is a fix to this. I think it's just how the browser works.

  5. #5
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Quote Originally Posted by Kevin View Post
    Thanks very much for both the background and the fix. I don't mind it now that I know what it is : ).
    Quote Originally Posted by eleven82 View Post
    I don't think there is a fix to this. I think it's just how the browser works.
    The fix is as I outlined, it is just a matter of whether or not you are willing to go to that length.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  6. #6
    Join Date
    Jan 2007
    Location
    The stage
    Posts
    568
    Thanks
    23
    Thanked 6 Times in 6 Posts

    Default

    Try this for the border
    either two things:
    Code:
    border: none;
    //OR!
    border: hidden;

  7. #7
    Join Date
    Apr 2008
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default And then there was...

    a:focus {outline:none;}

  8. #8
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Quote Originally Posted by new_toner_smell View Post
    And then there was...
    a:focus {outline:none;}
    There are various ways to do this, yes. The important thing to remember though is that however you override the browser's default behavior, you will be limiting accessibility in favor of your particular aesthetic. This is usually a bad idea.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •