How to import an specific stylesheet (CSS) for IE11??

SOLVE
Regular Contributor

   Hello partners!

 

   I've a problem with a "fieldset" I included in a test landing. The fields are working good in all the browsers, but when you try it in Internet Explorer 11, all the fields seem to be empty.

 

  I tried to add a specific stylesheet for IE11 adding the next code to the header of the landing:

 

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

 

   But seems it's no working, I think is becasuse the wrong link (href).

   What's the good way to do this??? Can anybody help me to solve this issue???

 

   Thanks in advance!!!!!

CSS
Reply
0 Upvotes
1 Accepted solution

Accepted Solutions
Highlighted
Regular Contributor

  Hi Stefen!

 

   First of all, thanks for trying to help!

   

   Yesterday I found this webpage:

https://stackoverflow.com/questions/48412244/apply-css-to-all-browsers-except-ie-using-media-query

   And that was the solution I was looking for!!!   

 

   This morning I followed your link and I saw @support is mencioned too, so you were right too! The article is very instructive, thanks.

 

   The solution I applied was:

 

@supports not (-ms-high-contrast: none)  {
/* Non-IE styles here */
           #simulator-fixed input  {
                       height: 20px;
            }
}

 

     Because the problem was with the fields height!

     Thanks again for your help!

                  Bye bye!

Reply
0 Upvotes
2 Replies 2
Advisor

@Hubsforero I wouldn't recommend loading a stylesheet specifically for IE. You should instead write your main stylesheet with progressive enhancement in mind: https://alistapart.com/article/the-slow-death-of-internet-explorer-and-future-of-progressive-enhance...

 

If you share a preview link the community here would be able to diagnose the issue you're seeing more easily.

--
Stefen Phelps
Web Developer / Co-founder
Kelp Creative Agency
Twitter — @stefen
Reply
0 Upvotes
Highlighted
Regular Contributor

  Hi Stefen!

 

   First of all, thanks for trying to help!

   

   Yesterday I found this webpage:

https://stackoverflow.com/questions/48412244/apply-css-to-all-browsers-except-ie-using-media-query

   And that was the solution I was looking for!!!   

 

   This morning I followed your link and I saw @support is mencioned too, so you were right too! The article is very instructive, thanks.

 

   The solution I applied was:

 

@supports not (-ms-high-contrast: none)  {
/* Non-IE styles here */
           #simulator-fixed input  {
                       height: 20px;
            }
}

 

     Because the problem was with the fields height!

     Thanks again for your help!

                  Bye bye!

Reply
0 Upvotes