Remove blue frame in IE 10 compatibility view

Question

How to remove or simply not display boundary links in each image anchor? By the way, the browser settings are in compatibility mode. Answers to other questions do not allow me to solve my problem. I think because this only applies to a lower version of IE.

EDIT:

I am currently creating custom sharing buttons that my client requires.

<div> <a onClick="window.open('https://twitter.com/intent/tweet?original_referer=#shareLink#&text=#shareTitle#&tw_p=tweetbutton&url=#shareLink#','sharer','toolbar=0,status=0,width=548,height=325');" href="javascript: void(0)"> <img height="20" src="/images/chicklets/Twitter_Tweet.png" /> </a> </div> <div> <a onClick="window.open('http://www.facebook.com/sharer.php?s=100&amp;p[title]=#shareTitle#&amp;p[summary]=#shareDesc#&amp;p[url]=#shareLink#&amp;p[images][0]=images/Telos.jpg','sharer','toolbar=0,status=0,width=548,height=325');" href="javascript: void(0)"> <img height="20" src="/images/chicklets/FaceBook_Share.png"> </a> </div> <div> <a onClick="window.open('http://www.linkedin.com/shareArticle?mini=true&url=#shareLink#&title=#shareTitle#&summary=#shareDesc#','sharer','toolbar=0,status=0,width=548,height=325');" href="javascript: void(0)"> <img height="20" src="/images/chicklets/LinkedIn_Share.png"> </a> </div> <div> <a onClick="window.open('https://plus.google.com/share?url=#shareLink#','sharer','toolbar=0,status=0,width=548,height=325');" href="javascript: void(0)"> <img height="20" src="/images/chicklets/Google_PlusOne.png"> </a> </div> 

CSS

 a { outline : none; text-decoration: none; } a img { outline : none; } img { border : 0; border-style: none; } div { float: left; padding-right: 10px; } 

Here's what it looks like with IE10:

Answer 1

how about this, try adding something like this

 <img src="blah" style="border-style:none;"> 

Answer 2

I usually use this as part of my regular default set in my CSS:

 img {border: none;} 

This does not affect other browsers negatively and easily overdo it at a later point if you place this at the top of your shared css file, e.g.

 img {border: none;} img.some-class {border: 1px double blue} 

If increased specificity adds an ugly border to your image, as IE does.

Answer 3

I had the same issue with IE10. I just set the CSS rule for the tag and set the text color to white. This removes the blue line around the anchor image.