Conditional Ie8 Style in Original CSS File

Conditional IE8 style in original CSS file?

You can either use a conditional html tag to add a class if the browser if IE and target via specificity, load an ie8 only stylesheet or use a CSS hack \0/ to target IE8 only.

I suggest the head route if you only have a couple one-off issues in IE.

HTML Class Method

In your HEAD

<!--[if IE 8]>    <html class="no-js ie8 oldie" lang="en"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->

In your CSS

.ie8 #menu ul li {
    display:block;
    width:110px;
    padding:15px 10px 15px 10px;
    text-align:center;
    color:#000;
    text-decoration:none;
    font-weight:bold;
    background:#e5e5c3;
    }

IE8 only stylesheet method

Load AFTER your common shared styles.

<!--[if IE 8]><link href="/css/app-ie8.css" type="text/stylesheet"/> <![endif]-->

IE8 CSS hack

use \0/ directly after selector

#nav li ul  {
  left: -39px\0/ !important;
}

IE8 Conditional Style sheet affecting all IE

My understanding is you want to target all the old IEs including IE8, so lte IE 8 (lower/equal) would work. You can also merge that lt IE 9 into the above one actually, like this:

<!--[if lte IE 8]>
    <script src="bootstrap/js/html5shiv.js"></script>
    <script src="bootstrap/js/respond.min.js"></script>
    <link rel="stylesheet" href="css/ie8.css">
<![endif]-->

For debugging, you can try to add something like body {10px solid red !important;} into your ie8.css and to see if that applies to the correct browsers.

Apply style ONLY on IE

Update 2017

Depending on the environment, conditional comments have been officially deprecated and removed in IE10+.

Original

The simplest way is probably to use an Internet Explorer conditional comment in your HTML:

<!--[if IE]>
<style>
    .actual-form table {
         width: 100%;
    }
</style>
<![endif]-->

There are numerous hacks (e.g. the underscore hack) you can use that will allow you to target only IE within your stylesheet, but it gets very messy if you want to target all versions of IE on all platforms.

How can I set CSS only for specific IE browsers?

How about that?

http://www.quirksmode.org/css/condcom.html

Or that if you don't like those statements

http://net.tutsplus.com/tutorials/html-css-techniques/quick-tip-how-to-target-ie6-ie7-and-ie8-uniquely-with-4-characters/

Else in html conditional for ie

The  will ensure that other browsers see the content between it and the next <!--. Notice how the syntax highlighter on Stack Overflow does not highlight the content as an HTML comment — that's how you can tell.

A more common variation that's somewhat shorter:

<!--[if gt IE 8]><!-->
  this is all browsers: IE9 or higher, firefox, chrome, etc.
<!--<![endif]-->

IE8 CSS Hack - best method?

You should reverse your method. First your site should look good in modern browsers (like Firefox, Chrome, Opera, IE 9), and then you can start worrying about the others.

As others suggested, conditional comments can be your friend.

First, you should develop your CSS to look fine in the modern browsers. Then check IE8, see what problems you get. If you need to, include an IE-specific stylesheet. After that, you can check in IE7 and then IE6 if you support it, and add further fixes.

An example:

<link rel="stylesheet" href="normal.css" type="text/css" />
<!--[if lt IE 9]><link rel="stylesheet" type="text/css" href="ie8.css"><![endif]-->
<!--[if lt IE 8]><link rel="stylesheet" type="text/css" href="ie7.css"><![endif]-->

In this case you include normal.css which is for modern browsers. You found some strange IE8 issues, so in ie8.css you fix the problems. You don't have to include all your selectors in this, only the ones that need a fix (the values will be overridden for IE 8 and lower). After that, if there are still some strange things in IE7, you can add your ie7.css and fix those, and so on.

Please refer to the links the others gave you to get more information on the usage of conditional comments.

Finally: making IE8 render as IE7 for ease is never a good idea, and should be avoided. IE7 is the far past (in the IT world, IE8 should be the far past either...), develop for the present and the future, and after that you can care about the people who are still stuck with old technology (based on your audience and business plan).

Conditional Ie8 Style in Original CSS File