Question

I have a background that I would like to change depending on which browser the user if using. If the user is using IE7 or IE8 I would like to change the background to a totally different image.

Can this be achieved by editing the CSS below as it seems pointless to create a new stylesheet for one item.

Thanks in advance for any help.

.navigation{
    background: url("images/navigation.png") no-repeat;
}

Answer 1

Pretty sure there’s no way to do it without extra markup.

You could just do this in the HTML:

<!--[if gte IE7]>
<style type="text/css">
    .navigation{
        background: url("images/navigation.png") no-repeat;
    }
</style>
<![endif]-->

Isn’t exactly the sexiest bit of code I’ve ever written, but it does the job without adding a whole separate stylesheet file. Though you might as well give in and make an iehacks.css file.