How to Remove Blue Line from Image/Link on Internet Explorer | HTML CSS

Hi there. I have recently bought and have been editing a landing page to use on an affiliate marketing campaign I’ve been promoting. At first there seemed to be no errors, I was using Firefox to master the design and I had it exactly how I wanted it. The problem arose when I tested the page in Internet Explorer. Take a look at the screenshots below. The first is from Firefox and the second from Internet Explorer:-

As you can see, on Internet Explorer the picture link shows a clear blue line starting from the left of the image and going about a third of the way through it. Anyway, at last check Internet Explorer was the most used web browser and probably still is today. Therefore there is no way I can just bury my head in the sand and hope people ‘don’t mind’ this annoying blue line in my sale’s pitch.

Blue Line in Internet Explorer – Problem resolved

Ok, I have now resolved this blue line error. It was not a CSS problem but a mere HTML error. In the HTML / CSS designed landing page. The HTML for the button was using the <a> tag and was styled using CSS. However, within the HTML <a> tag was a <span> tag which was unnecessary and I simply removed it. This removed the blue line and the landing page now looks identical on Firefox AND Internet explorer.

I don’t know if the problem any readers are having is identical to this but if so, then that’s how to remove the blue link from an Image/Link on IE.

Thanks for reading!

More on Web Design