By bpence on

For the life of me I cannot get specific style sheets to work with IE. I have read through multiple pages and forum posts about this on this forum and others throughout the ether. This is my last hope!!!

I used zen as my theme and made a new subtheme called "osusd" following the directions closely on this page:
http://drupal.org/node/629510

I have also installed the "Conditional Stylesheets Module" thinking that it would help me.

My osusd.info includes:

; Set the conditional stylesheets that are processed by IE.
conditional-stylesheets[if IE 8][all][] = css/ie.css
conditional-stylesheets[if lte IE 6][all][] = css/ie6.css

Which returns when I "View" >> "Source" in IE:

<!--[if IE 8]>
<link type="text/css" rel="stylesheet" media="all" href="/osu2011sd/sites/all/themes/osusd/css/ie.css?W" />
<![endif]-->
<!--[if lte IE 6]>
<link type="text/css" rel="stylesheet" media="all" href="/osu2011sd/sites/all/themes/osusd/css/ie6.css?W" />
<![endif]-->

However, no matter what change I make to those ie.css files, like a background color of a <div>, it always defaults to my layout-fixed.css styles.

I cannot believe this is that difficult of a task.

Really appreciate any help on this.

All the best,

B

⋅ Categories: Drupal 6.x

Comments

jarek foksa’s picture

jarek foksa commented

I see two possible reasons:
- the path to ie.css file is incorrect (go to <your site address> + /osu2011sd/sites/all/themes/osusd/css/ie.css, does it show the stylesheet?)
- the rules that you put inside ie.css are less specific than rules from layout-fixed.css (try adding !important flag to verify if that's that's the case)

bpence’s picture

bpence commented

Jarek,
Thanks for the suggestions. Didn't work though.

Went to:

go to + /osu2011sd/sites/all/themes/osusd/css/ie.css

and totally see the ie.css listed there.

Tried also using the !important tag in the ie.css file with no luck.

Why is this so hard?

B

jarek foksa’s picture

jarek foksa commented

Perhaps you have exceeded the limit of 31 stylesheets? Or your IE8 is working in compatability mode? Try [if lte IE 8] instead of [if IE 8]. I don't have any other ideas.

56rosa’s picture

56rosa commented

Hello jarek,

Thanks a lot for putting a link to John Albin. I have downloaded this module IE CSS Optimizer, and now my changes are showing for IE8.

Although some don't show yet. I'm hoping that by clearing the cache again, this other change will eventually show!

Thanks again

rolson’s picture

rolson commented

Check file perm. for ie.css. I know it's obvious but sometimes it's the little stuff that gets you. We always want to think big.

akalata’s picture

akalata commented

I thought I was going crazy on this today too, since I just started using Zen2 (having built a bunch in Zen1). My problem was that the .info file specified a css directory, but my sub-subtheme doesn't have a css directory. Usually my subthemes do have that extra directory, so I was copying code from earlier projects (even tried printing conditional comments directly into page.tpl.php) and it wasn't working, because the directory didn't exist! I know you said you already checked the absolute path to the css files and it worked, but by posting my "duh" moment I hope you'll be able to find yours. :)

There is also an issue in the Zen project issue queue regarding conditional stylesheets, though it doesn't appear to be the same problem we were having: http://drupal.org/node/698510

dealancer’s picture

dealancer commented

You also could use Conditional-CSS Integration module, which allows you to use css in a way like this:

/* Conditional-CSS example */  
a.button_active, a.button_unactive {  
  display: inline-block;  
  [if lte Gecko 1.8] display: -moz-inline-stack;  
  [if lte Konq 3.1] float: left;  
  height: 30px;  
  [if IE 5.0] margin-top: -1px;  
    
  text-decoration: none;  
  outline: none;  
  [if IE] text-decoration: expression(hideFocus='true');  
}

If you are going to commit my patches, please use a following authorship info as my previous username was `vackar` on drupal.org and it is still used in the D.O. Git system:

--author="vackar <vackar@243418.no-reply.drupal.org

senortim’s picture

senortim commented

I'm using Zen 1.11 and have put in lines for conditional IE stylesheets. But I'm not seeing any of this code in my generated pages. Thus, obviously, none of my IE styles are working. :-(

Has anyone seen this? Fortunately, my site looks nice in IE8, but I see from w3schools that over 20% of their visitors are still using IE7 or earlier. (!!) I can't wait to ignore these laggers....

--Tim

komal.savla’s picture

komal.savla commented

Try this out to fix css for IE
Add this function in your template.php

function phptemplate_get_[THEME_NAME]_styles() {
  $base_path = base_path();
  $path_to_theme = path_to_theme();
  $css_string = '';

  $css_string .= <<<EOD
<!--[if lt IE 7]>
    <style type="text/css" media="all">@import "{$base_path}{$path_to_theme}/css/fix-ie6.css";</style>
<![endif]-->
EOD;

    $css_string .= <<<EOD
<!--[if gt IE 6]>
      <style type="text/css" media="all">@import "{$base_path}{$path_to_theme}/css/fix-ie7.css";</style>
<![endif]-->
EOD;

    $css_string .= <<<EOD
<!--[if gt IE 7]>
      <style type="text/css" media="all">@import "{$base_path}{$path_to_theme}/css/fix-ie8.css";</style>
<![endif]-->
EOD;



    return $css_string;
}

Then add this line in your page.tpl.php inside the head tag i.e. before the body tag

<?php print phptemplate_get_[THEME_NAME]_styles(); ?>

And Then create your seperate css files for IE7 & 8 and named it as fix-ie7.css and fix-ie8.css
To test that whether your css file is working or not put this 

body {
  border: 1px solid red;
}

Clear the cache and check.

Thanks

56rosa’s picture

56rosa commented

Hello,

Prajakta gave me the same function than the one you gave above. http://drupal.org/node/986318

However, I'm still having trouble to make the changes show in IE8.
I even tried the Conditional_Stylesheets module, and still can't make it work. Besides, I wonder if I have understood well how to use it since it still did not work...

I'm kind of sick of trying to make it work. I mean that I have spent too much time trying to make it work already. Time is seriously ticking on my side.

If someone here could help me understand how I could make this IE8 stylesheet show, I would greatly appreciate your consideration here.

Thanks a lot

56rosa’s picture

56rosa commented

Hello,

I had the same problem as you can see above in my comment.

Thanks to John Albin explanations, and reference to his module IE CSS Optimizer (http://drupal.org/project/ie_css_optimizer), I was able to finally see the changes for IE8. I'm still quite a beginner in Drupal and I was starting to get very worried. Now, I'm feeling motivated again!!!

http://john.albin.net/css/ie-stylesheets-not-loading

Thank you John Albin!