0

I need help defining a conditional IE stylesheet in my .info file.

I am using the Zen starterkit as my base theme, and I have the conditional stylesheet module installed and enabled. I have added an ie.css file added to my css directory along with my other stylesheets. In that ie.css file, I have changed the background to an obnoxious color to confirm when the stylesheet is being used appropriately.

However, I have been struggling with what I need to put in my .info file. I have researched as much as I could and read the help.txt file multiple times. I just want this stylesheet to target IE. I do not want to create one for each version. This site will not support ie6 and ie7 anyways.

Here is what I currently have defined in my .info file for it:

stylesheets-conditional[if IE][all][] = css/ie.css

I have also tried this that just results with that stylesheet loading for all browsers:

stylesheets-conditional[!IE][all][] = css/ie.css

So far with all of my attempts, I can either get it to act as a normal stylesheet, having it override my other styles, or not having it load at all. Is there something I need to add in my page templates that I am overlooking?

I have this in the head of my html.tpl.php as well (I have my actual theme name in there):

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

Other resources that I have used:

1) Conditional Stylesheets Set-up: Using the Module

2) Add conditional stylesheet CSS for internet explorer only (not trying to use this method)

0

If this link is in your head it is like if the css file is in a folder under the currrent one. You need a first backslash: <!--[if IE]><link rel="stylesheet" type="text/css" href="/sites/all/themes/THEMENAME/css/ie.css" /><![endif]-->

As you can see in the answer you linked the definition in .info file has to look like

stylesheets-conditional[IE][all][] = css/ie.css

not

stylesheets-conditional[if IE][all][] = css/ie.css

(I just have it from this answer - never used this module). Honestly I would not install a module just to add conditional comments for IE. It is easier and saves performance eating module to put them simply into the html.tpl.php - you just have to keep the right paths.

stylesheets-conditional[!IE][all][] = css/ie.css

Makes absolutely no sence - I do not know if this module could interprete that. But at least no browser in the world would read a css file in such a conditional comment: every browser except IE ignores conditional comments. So you tell the only browser who reads them that this file is notfor it to use... you got it :)

  • I changed my definition in the .info file to what you mentioned and altered my line in my html.php.tpl with exactly what you had (with my theme name) without success. I agree with you on not needing the module at all. Since what you mentioned did not work, I tried to disable the module and give it a try; no success. Changed it to be formatted like the other "normal" stylesheets in .info file; no success. I did clear the cache with each attempt. If I remove <!--[if IE]><![endif]--> in the html then it works. I am using IE 11 so that might be the problem. I am not sure what else to try. – e.shell Aug 18 '14 at 21:37
  • I have tried everything I can think of. I even tried the older way by adding it through template.php with the appropriate hooks and that did not work either. It looks like there is another issue preventing the conditional stylesheets from working. – e.shell Aug 18 '14 at 22:05
  • Turns out after testing emulation modes with ie11, this stylesheet is picked up for all old versions but 10 and 11(edge). I now do not know how to make this stylesheet work for 10 and 11. – e.shell Aug 18 '14 at 22:20
  • msdn.microsoft.com/en-us/library/ie/hh801214%28v=vs.85%29.aspx - conditional comments are not supported any more starting with IE10 – Tobias Krause Aug 19 '14 at 6:20

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.