Best approach for fixing CSS issues to work with IE 7

Question

Recently, I started maintaining a web application which unfortunately works only with IE 6. Most of the issues are related to CSS.

Is there any tool which can help me standardize the CSS classes to work with both IE 6 and IE 7? I understand I have to go through standards but I need something to start with quickly.

Firebug can help me to some extend in identifying the CSS classes related to the UI elements (if the page renders on firefox). But, I was looking for something more like an advisor tool. If you have some experience to share, please feel free.

Answer 1

Try out SuperPreview or the whole package (Expression Web announced at Mix)..

SuperPreview is a new free standalone application from Microsoft (still in beta) which enables you to see how your websites will look across different versions of Internet Explorer making migration from IE6 to 7 and 8 much easier than before, without have to start up a Virtual Machine to run IE6, or have a separate computer dedicated to running IE6.

Answer 2

Check out Dean Edwards' IE7

Answer 3

Tredosoft's Multiple IEs is a good compare/contrast. You go ahead and upgrade to IE7, then install this (selecting just the IE6 option, unless you need all of 5.5/5.0/4.0/etc.), and you can see the pages simultaneously in both browsers. This will help you figure out what has to be conditionalized/hacked.

Also, the IE Developer Toolbar, although not as good as Firebug et. al., will at least let you see in IE what the browser thinks is happening with your styling.

Answer 4

Sometimes you need to introduce a little hack for IE6 and IE7 like removing double margin and I use the following pure CSS code

css-selector { code for all browsers }

*html css-selector {code for IE6 browser }

*+html css-selector {code for IE7 browser } 

it is not a tool that you expecting, but may be it would helpfull