I've implemented a landing page design for a campaign we are launching at work, and did testing on IE 7 on my XP machine at work and IE 8 on my 7 machine at home. These both worked and so I thought I had beaten IE, but as it turns out, different OS's IE render HTML differently even though they claim to be the same browser.
Anyone who has XP and IE8 will not see the site correctly at all.
I use two different CSS links. One for IE and one for !IE:
<!--[if IE]>
<link href="../images/content/pagebuilder/idop_2010/free-to-believe-IE.css" rel="stylesheet" type="text/css" />
<![endif]-->
<!--[if !IE]><!-->
<link href="../images/content/pagebuilder/idop_2010/free-to-believe.css" rel="stylesheet" type="text/css" />
<!--<![endif]-->
I had to use !IE because IE was still pulling CSS from the good stylesheet, and the IE sheet wouldn't update correctly (a different issue).
If I create IE specific CSS (IE7/IE8 vs just IE) could that fix the problem?
What's a good way to overcome an issue of Operating Systems + IE?
Edit
I installed IE 8 on my work computer and it has the same problem as all the other IE 8 computers. I have Internet Explorer developer tools, and I noticed that IE was running in "IE8 Standards Mode" When I switched it to "IE7 Standards Mode" the layout worked perfectly. I also noticed on my laptop with Windows 7, that the compatibility mode icon was activated. When I turned it off, I was able to duplicate my problem. So now I know for sure it's an IE8 issue in general, not necessarily an OS issue.
I've now created an IE8 specific stylesheet which I'm going to start overhauling to get it looking right.
Here is the site: http://members.opendoorsusa.org/site/PageServer?pagename=IDOP_2010
Anyone who wants to take a look at it and give me suggestions as far as CSS is concerned, I would appreciate it (I didn't do the design, just implementation, so no design critiques please)
Now that I know that this is the problem, I have another question. Why in the world does IE 8 display so different than IE7?!