CODEWITHSUNDEEP
internet-explorerinternet-explorer-8internet-explorer-7internet-explorer-6
user1382390
user1382390

Reputation: 1

IE 7 and 8, possibly 6 Website Issues

I launched a website this weekend for a client of mine. It looks good in Firefox, Chrome, Opera, Safari, and IE 9.

However, IE 7 and 8 (maybe 6 too) are giving me real issues. The home page is fine but the secondary pages have a different theme layout.

I edited the Twenty-eleven Wordpress theme. I have a Mac so it is hard for me to test IE since it is a Windows browser. I have an XP laptop that has IE 8 installed on it. That is how I know it is messed up. The secondary pages are really bad.

My main content, left side bar, and footer are all mis-aligned. I have tried several things to try and fix the problem. I researched hacks and tried them but to no avail.

I tried changing the positioning on my images but it just made the page look even worse than it does now. I am really stumped here.

If someone could please help or lead me in the right direction please it would be much appreciated. The URL is www.jubileecf.com. Thanks, ~Ash~

Upvotes: 0

Views: 214

Answers (1)

Spudley
Spudley

Reputation: 168685

The problem is visible in your code:

<script>(function fix_ie8() {if (strpos($_SERVER['HTTP_USER_AGENT'],”MSIE 8″)) {header(”X-UA-Compatible: IE=7″);}}

add_action(’send_headers’,’fix_ie8‘))();

This is wrong on several counts.

  • Firstly, it is using the wrong quote characters.

  • Secondly, you've got PHP code there trying to be Javascript.

  • Thirdly, even if you change it back to PHP, you still need to move it, because header() can only be called before any part of the page has been output. So it needs to be done before you start, not in the middle of the header.

  • Finally, the reason this is breaking the site so badly is because it's causing the Javascript interpreter to see an error, and stop processing. Therefore you IE fixes in the html5.js file you're including won't get run, and thus your page layout will be busted.

In short, this line of code needs to be locked away and never spoken of again.

So let's pick apart what's going on here and try to find a solution...

The code is trying to use the X-UA-Compatible header to force IE8 into IE7-compatibility mode. The thing I would say to that is that since you state that you never even tested in IE, why do you think you need to use IE7-Compatible mode anyway?

Why not just try it without that line of code at all, and see what happens? If you do have some minor layout glitches in IE8 as a result, better to fix them rather than use compatibility mode.

If you must use IE7-compatible mode, then you can use it without needing any kind of scripting at all. Simply do use the meta tag:

<meta http-equiv="X-UA-Compatible" content="IE=7" />

That's all you need.

If you want the tag to only affect IE8 (ie not IE9), then you can wrap it in IE conditional comments (which you're already using elsewhere on the page).

Upvotes: 1

Related Questions