Solving the Problem
The issue with this page is identifiable as a floating box problem, which results in Internet Explorer 8 rendering the text wrap correctly, while versions 7 and 6 do not. You will now address this issue by modifying a CSS rule in Expression Web.
Press Alt-Tab on your keyboard to toggle into Expression Web 3.
Double-click the styles.css file in the Folder List panel to view the CSS code for your page.
Scroll down to line 385 at the end of the document, and locate the line of code that begins with ‘height: 100%.’ This is the rule that’s triggering the floating box problem.
Delete the line ‘height: 100%’ and save your file.
Press Alt-Tab to return to SuperPreview.
In SuperPreview, refresh the screen by clicking on the Refresh button.
Toggle between Internet Explorer 6 and 7 in the Comparison view to see that the problem with your type is now solved.
You’ll now take this fix one step further by removing Internet Explorer 8 from the equation, and simply comparing Internet Explorer versions 7 and 6.
In the Baseline area, click the Close button to remove Internet Explorer 8 as your baseline browser.
In the Baseline screen, click the Internet Explorer 7 button to select it as your baseline browser. This will automatically move the browser over from the comparison section so you will only be left with IE7 and IE6.
Despite the fact that there still appears to be an issue with the positioning of the page’s footer between these two browsers, you can now work to isolate the problem using the same steps as above. The good news is that the urgency is less due to the fact that the layout issue is minor and it is more apparent in IE6.