Today I ran into a really weird bug in IE 7. I had done some CSS and HTML handed it off to our programmer to add to our site. My version worked in both Internet Explorer and Firefox, but once it got included into the asp code and added to the site, it looked funky (see below)

Side note: it still looked fine in Firefox (Surprise!)

I looked at the styles and checked our version control only to find that nothing had changed. It was as if IE was ignoring the margin and absolute positioning I had styled. I was stumped.

Next I viewed the source in IE and noticed some extra white space in one of the anchor tags:

It was a long shot, but I jumped into the ASP and noticed that the anchor tag was broken up into 3 lines of response.writes. I combined those 3 lines into one. The source now looked like this:

And wala! The page looked great:

It’s funny how tiny things like that can set IE off. If you’re having any similar issues with overlapping link text etc. make sure you don’t have any white space within the link text area.

As usual, what appeared to be an extremely tough problem ended up being an easy fix.