Posts Tagged ‘fixes’

Fixing Bugs and Browser Issues in IE6, IE7, and IE8

Friday, November 20th, 2009

Lately I have been dealing with a ton of browser issues across the board.  It seems like every website I’ve worked on in the last year has been loaded with issues on each internet explorer browser.   I’m here to share some of those tips with you.

It would actually be very helpful if our virus developing enemies did something productive and created a virus that would destroy internet explorer 6 on every computer in the world.  All joking aside, the seven year old IE6 has major issues that leave the best web designers begging for help.  On most sites, I’ve decided to simply not fix IE6 and instead place a conditional statement on the top of the site when it is viewed in the outdated browser.  I’ll show you how to do that later.  For now, let’s look at the basics and deal with IE7 and IE8.

I’m assuming you made your designed your site looking at Firefox.  If not, you can do similar fixes described below.  You should be able to make all the corrections using your CSS files (creating conditional style sheets/css files) Look below at the different solutions.  You might be able to fix it pretty quick if it just a problem in Internet Explorer 8. Find out where you are and follow my instructions.

THE WEBSITE WORKS IN IE7 AND FIREFOX BUT HAVING PROBLEMS IN IE8
You’re lucky.  This fix is easy because Microsoft figured out that IE8 was gonna cause problems for sites designed in IE7.
Here’s what you do:

1. In your headers below the “meta keywords” or “meta description” paste this code:
<meta http-equiv=”X-UA-Compatible” content=”IE=7″ />

2.  If your working in Wordpress just paste this in the header.php file.  You’ll be good to go on all your pages.


DESIGNED THE WEBSITE IN FIREFOX HAVING PROBLEMS IN IE6/IE7/IE8
This one is a little more complicated. So we will start with IE7 since it is the most used today. Here are the steps:

1. Create a file called ie7.css and copy all the code from your style.css file into it.
2. Drop this into your FTP directory next to the style.css file
3. Open your index.html page (or if working on wordpress/cms website open your header.php file)
4. Put this code immediately before the </head> tag (change the directory to match your directory and replate “yoursite” with the appropriate domain.

<!–[if IE 7]>
<link rel=”stylesheet” href=”http://yoursite/directory/ie8.css” type=”text/css” media=”screen” />
<![endif]–>

5. Begin adjusting items like padding, margin, color, etc. in the ie7.css file.  Save and refresh your browser.  The changes should only be happening in the Internet Explorer 7 browser.

6. Repeat this same process for IE6 and IE8 (or use the force compatibility meta for IE8 described above)

Again, you want to start adjusting items like margin, padding, float, align etc.  These are usually the core of the bugs.  If all else falls you can manually create tables as a last resort.

Tags: , , , , , , , , ,
Posted in Uncategorized | No Comments »

  • Old Stuff

  • Topics