Getting rid of the dotted border around links the right way Link
9th December 2009 at 12pm Be the first to comment... Tweet a link to this on Twitter ↩
I heard Patrick H. Lauke from Opera speak at the FOWD Tour Glasgow on Keyboard Access Essentials and today’s 24 Ways article (which I hope everyone is reading) by Patrick does a great job of summarising one of the key points that he spoke about.
Removing the dotted line that occurs around clicked links in Firefox and Internet Explorer can be achieved with one super simple CSS rule :focus {outline: none;}. The big problem is accessibility, people using anything other than a mouse need :focus to see where they are within the page. Patrick’s solution to this problem is simple, and what I really took away from his article is that I should be applying :hover styles to :focus as well, something I have been neglecting to do.