Question

I am trying to make the ugly grey border that appears around anchor tags go away. The CSS property outline:none; works for Firefox, but how can I do it in IE? Preferably using CSS expressions or jQuery. I’m not worried about accessibility BTW.

---

Based on your suggestions I found these to be the best solutions:

• The jQuery (for IE browsers):

  $('a').focus(function() {
      $(this).blur();
  });
  

• Another jQuery option (for IE browsers only):

  $('a').focus(function() {
      $(this).attr("hideFocus", "hidefocus");
  });
  

• The CSS (for all other browsers that force an outline):

  a {
      outline: none;
  }
  

Note: Some browsers such as Google Chrome don’t force an outline on focus.

Answer 1

Unfortunately I think hideFocus is your best answer as blur isn’t always appropriate:

<a href="..." hidefocus="hidefocus">...</a>

http://msdn.microsoft.com/en-us/library/ms533783(VS.85).aspx