Get rid of dashed box around links

Author: | Posted in CSS, Web 2 Comments

A great easy improvement for any website is getting rid of that annoying dashed box that appears when clicking on a link. Many big sites like and have not removed this dashed box from their hyperlinks and I think it just looks tacky. I understand that it might help some users understand that it is a link, but it also detracts from the design of the page. I think we have surpassed the age of tables and outlines, people know from common sense today where a link is and isn’t.

Here is a small snippet of CSS that you can add to your stylesheet that will remove the outlines [dashed box] from your hyperlinks. This is successful in Mozilla Firefox 2, 3, Internet Explorer 7, 8, and Safari 3, 4.


I think it is an easy way to add some class to your page. I implement this in every page I design. Below is an example of a dashed/outlined hyperlink box.

Hyperlink Outline Box - Dashed Box

Incoming search terms:

  • get rid of dashed line around image in hyperlink
  • SUF

    Interesting thoughts on your blog, can i ask where you got your colors from?

  • Alex ‘Freedom’ Haines

    Okay, never even thought of that and it’s going to be implemented on every site I can as soon as I can so thanks a bunch!