4 methods to remove the blue border image link, using CSS
First of all that blue border is coming from the color of your links, so it can be any color. To remove that border from the images which have a link you’ll have to add to your style one of the following four lines, each one doing practically the same thing.
Is not necessarily to style img a. It’s OK to style only the img and will apply that style to all images from that page/website, no matter if that pictures are carrying a link or not. If you want to apply the style only on a preferred page you will have to add the style into the header of that page only.
Add one of the following line to your css file and it will remove that annoying blue border image link:
img {border: 0px}
img {border: 0}
img {border: solid 0}
While some of these methods will work, other will not. I recommend using of: img {border: none}, which works well in all known web browsers. Many html-shrinker programs (programs which strip out superfluous white space and unneeded markup, to reduce the size of the page) reduce 0px, 0em, 0pt, etc) to just “0″ and the page-size is reduced by a few bits on every instance.
All of these methods are valid markup but, except the one I’ve just recommended, don’t expect to give the same results in all browsers.
As a final advice try to specify style, width and color explicitly. Not all browsers are that smart we want it to be and you understand perfectly about which one(s) I’m talking about.
If you enjoyed this post, please consider to leave a comment or subscribe to the feed and get future articles delivered to your feed reader.
You forgot the ;
Like:
img { border: 0px; }
nice to meet you here Vanez. There is no need to use a semicolon after the last css property. In my case I have only one property for every div. As a general thought I don’t use semicolon after the last property because I wanna save a few bytes. Thanks for your comment :)
hi! Ken
my problem is different -on my blog whenever i click any image link for example twitter icon ,..after click it generates border and not before clicking. so what should i do to get rid of that border(after click or just after drag and drop).
am using blogger template
please help thanks.
I think CSS is doing well, the browsers aren’t…… and I am very surprised why webmasters are so afraid of CSS layouts, at the same time I believe it is a good idea to utilize tables sometime (even though I try to stay away from it mostly)…… and please don’t expect it to map your brain for you…… there will always be hacks and workarounds, they are a webmaster’s enthusiasm of staying ahead of the existing technology.
Thanks for the 4 great methods of removing that annoying blue boarder. Your post a lot of countless hours trying to find a solution. I’m looking forward to reading more of your site in the future.
@hacker9 . sorry saw this after 2y…. u have to style a:visited.
i.e. a:visited {text-decoration:none}