Creating Separate Style Sheets for Internet Explorer and Firefox
Updated November 26, 2007
IE and Mozilla handle CSS instructions differently. It's annoying! But, there is a way to get around it. Make multiple style sheets, one for each type of browser. Then customize each style sheet for it's corresponding browser.
Create two style sheets, one for IE browsers (IE-stylesheet.css) and one for every other kind of browser (default-stylesheet.css).
Tell Internet Explorer to use a separate style sheet by inserting the following code between your header tags <head></head>. Change the name and path of the css files to that of the css files on your site. The code must appear in this order.
<!--[if IE]> <link rel="stylesheet" type="text/css" href="IE-stylesheet.css" /> <![endif]--><![if !IE]> <link rel="stylesheet" type="text/css" href="default-stylesheet.css" /> <![endif]>
This method does not rely on javascript, so it will work even if javascript is disabled. The <![if IE]>, <![if !IE]>, and <![endif]> tags are only recognized by Internet Explorer.

