How to use Multiple CSS for different browsers? (ASP.NET C#)

meetpd used Ask the Experts™

I created a site and tested it on IE8. Then I realized that it didnt look the way it is suppose to in IE6.
What should be the best approach in dealing with this problem?

Will having multiple CSS help? If yes, how to implement it?

My site is developed in ASP.NET C#
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®

In your head tags you can put different conditional styles for different IE browsers.

eg. the following sets 2 different styles for IE browsers, the first is for IE browsers less than IE7 ( [if lt IE 7] ), and the second sets a different style for all IE browsers ( [if IE] ).

<!--[if lt IE 7]>      
      <style type="text/css" >
            #menu {margin-left:3px;}            
            .panel p {margin-top:-10px;}
<!--[if IE]>      
      <style type="text/css" >
            hr {margin:0 auto 0 0;padding:0px;padding-top:-10px;}
            .break {display:none;}

These must be placed in your head tag anywhere AFTER the link to your main css file.
All other browsers will ignore them.

To see this in action look at the source of:

For more info:

Hope this helps,


Richard LeeSoftware Enthusiast
Another option which fits in with the ASP.NET Themes is to use the previously mentions feature (Themes) and simple change the them in the pages Pre_Init event when it loads.
Of course to determine when to change the theme you will need to check what browser is currently loaded and you can do that by checking the Request.Browser property.
Of course each theme will contain the varying CSS files and simple as that you have different CSS files loading.

Do more with

Expert Office
Submit tech questions to Ask the Experts™ at any time to receive solutions, advice, and new ideas from leading industry professionals.

Start 7-Day Free Trial