Blue border around image maps in Internet Explorer

2019-03-27 05:40发布

问题:

I've got the following problem - I'm using image maps on the site. In Internet Explorer 9 (IE8 is fine), when I click on link (area tag), there appears a blue border around it. How to get rid of it? I've tried:

map, map area {
border:none !important;
}
img, a img, a:link img, a:visited img {
border:none !important;
}

But it didn't help. Did anyone have this problem? Please look at the site - http://www.naturalnie.test.dih.pl/. Image map is under logo, where links say: "Home, Kosmetyki, Lekarstwa, Żywność i suplementy, O Naturalnie.net".

EDIT:

I found the solution. Following code works:

a, img {outline:none;}
map > area,
map > area:active,
map > area:focus {outline: none; border:0; }

回答1:

Why not just

a,img { border: none; }


回答2:

this worked for me

:focus{
  border: none;
  outline-style: none; 
  -moz-outline-style:none;  
}


回答3:

I'm not really sure, but try to set in html the <img border="0" />



回答4:

Since you say the border appears after clicking on the link, that sounds to me like a "focus" bordering.

Try a:focus {border:0 none;}



回答5:

This solution will cause conflicts with images that double as both links and content that also have borders. However, if your image links have no existing borders, it should work to rid you of the outline in IE with compromising anything else:

a img {border: none; }

Just add it to your master css styles sheet...it fixed my problem perfectly.