Silly HTML mistake – different response from FireFox and IE

Recently I found an interesting problem. A person complained to me that a link on a web page did not work. When I went to the page I was able to duplicate the problem with my default browser, Internet Explorer. Since I was pretty sure the developer who composed the page would have tested their links, I was puzzled. So I tried FireFox. The link worked! When I looked at the html code I saw the error immediately. He was using an <input> tag inside the link tags, <a>, to display a graphic. The <input> tag would have been appropriate if he wanted to display a graphic in a form but the <img> tag would have  been the correct way to create a click-able graphic link. It looks like the developer had used some code from a form but he was sloppy in converting the code and had not tested the page with IE.

What was interesting was the way Internet Explorer and FireFox responded to the coding error.  FireFox ignored the error, displayed the graphic, and let the link work. It was a mistake but FireFox did not care. Internet Explorer on the other hand displayed the graphic but did not let the link work. Now that is typically a surefire way to get a developer’s attention. Too bad the developer forgot to test his page with IE! I ran the page through the W3C HTML validation service and it did not flag this as an error. Hmm!