Different CSS when using different browsers problems?

 <!--[if gte IE 5]>
        <link rel="stylesheet" type="text/css" href="iemaster.css" />
    <![endif]-->
    <![if !(IE 5)]>
        <link rel="stylesheet" type="text/css" href="master.css" />
    <![endif]>

to load a different stylesheets depending on whether or not it is IE. The problem is that i have button bar going across the top. In IE I need the padding at 0 and other wise i need it at 200px, but no matter what I do to the values, the bar in IE doesn't seem to change. It changes for chrome though. The only thing that seems to work is if I make the class affecting it a different name then the non-IE one. Of course this means my non-IE wouldn't load properly. Other the开发者_开发知识库n this the CSS seems to load perfectly. Why is this?

That's not how you should be doing it.

Nobody is using IE5, so forget about that.

Do it like this instead:

<link rel="stylesheet" type="text/css" href="master.css" />

<!--[if IE 6]><link rel="stylesheet" type="text/css" href="ie6.css" /><![endif]-->
<!--[if IE 7]><link rel="stylesheet" type="text/css" href="ie7.css" /><![endif]-->

Your master stylesheet will get loaded in every browser.

• Are you sure you care about IE6? If so, put IE6 specific rules inside ie6.css.
• Put IE7 specific rules inside ie7.css.

You shouldn't need a separate stylesheet at all for IE8 or IE9. Those browsers are compliant enough to handle the same stylesheet as the other browsers.

Your bottom block is not actually a comment (it doesn't begin with <!--) so all browsers will read the master stylesheet. Also, check your logic: IE6 is both greater than IE5 and != IE5, so the main stylesheet will get loaded for some versions of IE anyway.

If you reverse the order that you link to the stylesheets that should fix it. What's happening is the IE-specific style sheet is being set first, but the master.css is overwriting it after.

Also, I don't think you need <![if !(IE 5)]> and <![endif]> around the non-IE one.