By Goosestaf on

Hello anyone kind enough to read!

I'm having a few problems using Condition comments in the bluemarine theme, i'm also using drupal V5.

The problem is similar to this one: http://drupal.org/node/91040

I need a separate CSS file for IE6 and below (iestyle.css) and one for everything else (the standard theme style.css)

I've tried using this code:

<!--[if lt IE 7]>
<?php echo theme('stylesheet_import', url($directory.'iestyle.css')) ?>
<![endif]-->

but when i do, IE6 just loads the normal style.css and not the iestyle, like it should.
i've tried placing the code above, and below the <?php print $styles ?> code, but it just gives me the same problems.

any help/ideas. . . . . . . . .

⋅ Categories: Drupal 5.x

Comments

styro’s picture

styro commented 

    <!--[if lte IE 7]>
      <?php /* [if lte IE 7] assumes that IE 8 will be able to just use the standard stylesheet */ ?>
      <?php print theme('stylesheet_import', base_path() . path_to_theme() . '/ie.css') ?>
    <![endif]-->

As far as I can tell it works.

--
Anton
New to Drupal? | Forum posting tips | Troubleshooting FAQ

Goosestaf’s picture

Goosestaf commented

no good i'm afraid. . . ., still loads the default style.css file for some reason.

just incase i'm doign anythig nelse wrong, this is what the rest of the head section looks like.

and heres my site, www.heartlessdesign.co.uk/loading

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="<?php print $language ?>" xml:lang="<?php print $language ?>">

<head>
  <title><?php print $head_title ?></title>
  <?php print $head ?>
  <?php print $styles ?>
<!--[if lte IE 7]>
<?php /* [if lte IE 7] assumes that IE 8 will be able to just use the standard stylesheet */ ?>
<?php print theme('stylesheet_import', base_path() . path_to_theme() . '/iestyle.css') ?>
<![endif]-->
  <script type="text/javascript"><?php /* Needed to avoid Flash of Unstyle Content in IE */ ?> </script>
</head>
styro’s picture

styro commented

my IE stylesheet isn't to be used instead of any other css - it is for a very small number of additional IE specific overrides to the standards compliant stuff in the main stylesheets.

If you wanted to serve completely different CSS, you'd need to configure the server to include stylesheets based on the browser. Conditional comments can't stop IE doing anything outside the comments.

Anyway I'd personally not want to maintain two sets of CSS where most of the info was just repeated.

--
Anton
New to Drupal? | Forum posting tips | Troubleshooting FAQ

Goosestaf’s picture

Goosestaf commented

again, thanks for the reply,

but i'm whats typically known as a noob when it comes down to creating code, and i don't quite get what you mean about configuring the server.

The reason i wanted to do this, was to simply change the BG of the whole site to a flat white for IE6 and below, due to the transparency PNg issues.
I've tried a number of PNG fixes, but none worked, and besides i didnt believe there was a fix for repeating background pngs anyway.

so is there a simpler way to simply make this background colour change for IE6 and below. . .. like maybe include some sort of code in my existing style.css to detect and make the change?. . .

any ideas?

styro’s picture

styro commented

but i'm whats typically known as a noob when it comes down to creating code, and i don't quite get what you mean about configuring the server.

You'd have to sniff out the browser and decide what CSS to send it. It's a very ugly flaky solution and I wouldn't recommend it.

The reason i wanted to do this, was to simply change the BG of the whole site to a flat white for IE6 and below, due to the transparency PNg issues.
I've tried a number of PNG fixes, but none worked, and besides i didnt believe there was a fix for repeating background pngs anyway.

so is there a simpler way to simply make this background colour change for IE6 and below. . .. like maybe include some sort of code in my existing style.css to detect and make the change?. . .

It isn't a complex as you think.

There is no detection needed, just use standard CSS itself.

If that is the one change you need to make, just copy the part of your themes stylesheet that sets the background into your IE stylesheet and change the settings there. eg in the IE stylesheet set the background image to nothing and set a background colour.

If the IE stylesheet is imported after your themes one the IE setting will override it. All the other browsers will ignore the comment importing the IE style so get the original.

--
Anton
New to Drupal? | Forum posting tips | Troubleshooting FAQ

Goosestaf’s picture

Goosestaf commented

still no good :S

my iestyle.css is only this now

body {
  margin: 0;
  padding: 0;
  color: #000;
background-color:#ffffff;
  font: 76% Verdana, Arial, Helvetica, sans-serif;
}

and like before, using this detection n my pagetpl file.

  <!--[if lt IE 7]>
<?php /* [if lt IE 7] assumes that IE 8 will be able to just use the standard stylesheet */ ?>
<?php print theme('stylesheet_import', base_path() . path_to_theme() . 'iestyle.css') ?>
<![endif]-->

am doing somethign wrong for this not too work?

styro’s picture

styro commented

background-image sits 'above' background-color. When you have both, you will only see the background-color where it isn't covered up by background-image.

In your IE stylesheet, you will need to override background-image - eg:

body {
background-color:#ffffff;
background-image: none;
}

That's what I meant by:

If that is the one change you need to make, just copy the part of your themes stylesheet that sets the background into your IE stylesheet and change the settings there. eg in the IE stylesheet set the background image to nothing and set a background colour.

when I said "set the background image to nothing".

I also removed the margins, paddings and font from the IE stylesheet because they aren't needed there. If they aren't set they will just get those settings from the main stylesheet.

It won't help with conditional comments (being IE things), but the Firebug extension for Firefox is great for seeing how inheritance and overriding happens with multiple stylesheets.

--
Anton
New to Drupal? | Forum posting tips | Troubleshooting FAQ

Goosestaf’s picture

Goosestaf commented

really sorry, but its still not working :S

www.heartlessdesign.co.uk/loading

i really have no clue why this isn't working right . . . .
after reading into it all. . . . it should be :s

i've been testing it on IE 6, so it should all work fine. . .

sorry to be such a pain. . . but any ideas. . . do you think it could be a problem with the theme . . . .

styro’s picture

styro commented

You need to figure out where the problem is happening - is it your conditional comment, the CSS or the PHP that specifies the stylesheet.

Can you put some radical overrides into your IE CSS? eg changing the color of something to pink while Firefox ignores it. If so, then the conditional comment is working.

Look at the HTML source - is the stylesheet reference even in the HTML? If not the PHP is the problem.

If the conditional comment is working and the proper stylesheet is being specified, then it is an issue with the CSS itself. You need to make sure that the selectors in your IE CSS are 'specific' enough to override the standard CSS. eg setting body {somesetting: somevalue;} won't work if there is a body#bodyid {somesetting: somevalue;} in the standard CSS.

But after looking at your first post more carefully (I just skimmed it the first time), I noticed you were using Drupal 5.0. In that case, there is no theme_stylesheet_import() in 5.0. Use this instead:
http://api.drupal.org/api/HEAD/function/drupal_add_css

--
Anton
New to Drupal? | Forum posting tips | Troubleshooting FAQ

Goosestaf’s picture

Goosestaf commented

IE CSS wasnt makign any extreme changes,
The stylesheet refference was i nthe html source,
so its obviosuly the comment.

and. . . after lookign over the link u posted, i'm really lost with it.
i don't quite know what to do with it, and which bits to change/replace.

i tried using it i nthe way i thought, but it just brought up php errors.

don't suppose i could be a pain and ask how to use it?

styro’s picture

styro commented

How did you try using it, and what were the errors?

I don't use 5.0 myself yet.

--
Anton
New to Drupal? | Forum posting tips | Troubleshooting FAQ