title: How to remove borders around links in IE?
body: <p>I have a navigation bar which consists of a <code>&lt;img&gt;</code> elements within their respective <code>&lt;a&gt;</code> elements. However, for some reason in IE its making a dark black border around the images. Its not doing the same in other browsers, I can't seem to figure this out... This is the html that I'm using.</p>
  
  <pre><code>&lt;li&gt;
     &lt;a href="#"&gt;
        &lt;span id="nav1"&gt;
           &lt;img src="tt_1.png" /&gt;
        &lt;/span&gt;
     &lt;/a&gt;
  &lt;/li&gt;
  </code></pre>
  
  <p>I have about 5 links all written like that and I've used CSS to style it into a nav bar. On other browsers it comes out like this <img src="https://i.stack.imgur.com/SehhR.png" alt="good bar"></p>
  
  <p>but on IE it comes out like this <img src="https://i.stack.imgur.com/KqZJi.png" alt="Bad bar :("></p>
  
  <p>I've never encountered a problem like this before and what I've reserached to try and fix it so far haven't worked. Is there a way to take out these borders using CSS? </p>