0

I would like to apply css styles like 

 margin-left, height,width

only for IE browser. I tried following ways but it is applying for other browsers also.

    @media all and (-ms-high-contrast: none), (-ms-high-contrast: active)
      #chart
      {
         margin-top : -105px;
      }
      @media screen and (min-width:0\0)
      {
          #chart
         {
            margin-top : -105px;
         } 
      }

       @media screen/9 and (-ms-high-contrast: none), (-ms-high-contrast: 
       active)
          #chart
         {
            margin-top : -105px;
         }

Please help. Thanks.

Techie
  • 759
  • 4
  • 11
  • 29
  • instead of having complex and non readable rules like this. You can simply add modernizr or check navigator and add a class called "IE10" to your html tag and write css based on that. – karthick Feb 21 '18 at 06:59
  • 2
    Possible duplicate of [How to target only IE (any version) within a stylesheet?](https://stackoverflow.com/questions/28417056/how-to-target-only-ie-any-version-within-a-stylesheet) – Gerard Feb 21 '18 at 07:00
  • IE css hacks https://gist.github.com/zunairmushtaq/aeaa48432d51cad0eb1c – Athul Nath Feb 21 '18 at 07:00

1 Answers1

0

I have tested the below code. Have a try

HTML : 

<h1>try me </h1>

CSS : 

html[data-useragent*='MSIE 10.0'] h1 {
  color: blue;
}

JS : 

var b = document.documentElement;
b.setAttribute('data-useragent',  navigator.userAgent);
b.setAttribute('data-platform', navigator.platform );

https://css-tricks.com/ie-10-specific-styles/

IE9 or Above:

@media screen and (min-width:0) and (min-resolution: +72dpi) { 
      Your Code
 }
Ramkee
  • 900
  • 1
  • 10
  • 27