Apply css styles only to ie9

Question

im my website i have a file (ie.css) to correct css problems of the ie. However, now i have a litte problem. Some default styles of the website are good on ie8 and not on ie9.

So, i would like to apply the follow css code inside the file "ie.css" only to the ie version 9, is that possible?

.ngg-galleryoverview {
    overflow: hidden;
    margin-top: 10px;
    width: 100%;
    clear:both; 
    display:block !important;
    /*border: 2px solid #ADE132;*/
    /*margin-left: 10px;*/
    margin-left: 2%;
}

.ngg-gallery-thumbnail {
    float: left;
    margin-right: 3%;
    /*margin-right: 10px;*/
    text-align: center;
    /*border: 2px solid #ADE132; */
    height: 430%;
    width: 430%;
}

I copied your title into google and got: "About 2,210,000 results" the first of which answers this question. — Ryan McDonough
– Ryan McDonough, Commented Sep 24, 2012 at 13:40

dsgriffin · Accepted Answer · 2012-09-24 13:38:20Z

3

What you're looking for is conditional comments:

<!--[if IE 9]>
<style type="text/css">
  IE specific CSS rules go here
</style>
<![endif]-->

answered Sep 24, 2012 at 13:38

dsgriffin

68.8k17 gold badges141 silver badges139 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Caelea · Accepted Answer · 2012-09-24 13:39:48Z

3

The best way to do this is to set a body class only for IE9 and when you want to modify your css it will begin wit that class in front any other html tag or class. This will guarantee that your css is w3c compliant.

Here's the code for that:

<!--[if IE 9 ]>    <body class="ie9"> <![endif]-->

answered Sep 24, 2012 at 13:39

Caelea

2,34815 silver badges22 bronze badges

3 Comments

Ana Over a year ago

Or on the html tag github.com/h5bp/html5-boilerplate/blob/master/index.html

Caelea Over a year ago

If you apply it on the html tag you will have problems with windows phone, who IE doesn't like to see anything in the <html> tag. I tested myself, so the best option is to use it on the <body> tag.

Joel Kinzel Over a year ago

This is probably one of the better ways to go. It doesn't require an extra HTTP request like loading an extra CSS file would.

aquinas · Accepted Answer · 2012-09-24 13:38:15Z

2

Use IE conditional comments:

<!-- [if ie 9]>
 CSS that you want to be IE only
<![endif]>-->

answered Sep 24, 2012 at 13:38

aquinas

23.9k5 gold badges60 silver badges82 bronze badges

2 Comments

user1511579 Over a year ago

I have to create a file specific to solve this? Or i can use those tags inside my ie.css file?

aquinas Over a year ago

You could have in that if statement the link to your ie.css. Or, as others have said, you could go a different route and change your HTML class, like this: paulirish.com/2008/…

saurabh · Accepted Answer · 2012-09-24 13:44:08Z

1

Try in css like

:root .classname{ color:pink \0/IE9; } /* IE9 */

OR write in head tag

<!--[if IE 9]>
<style>
Special instructions for IE 9 here
</style>

<![endif]-->

answered Sep 24, 2012 at 13:44

saurabh

111 bronze badge

1 Comment

Mark Over a year ago

i would suggest the conditional css rule

Collectives™ on Stack Overflow

Apply css styles only to ie9

4 Answers 4

Comments

3 Comments

2 Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

3 Comments

2 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related