Search code examples
cssinternet-explorercompass-sasssasscss3pie

Compass and PIE don't seem to work


I'm using Compass to create webpage CSS styles. I wanna use CSS3 features like border-radius and linear-gradient but Internet Explorer refuses to cooperate.

I coded it this way:

$pie-behavior: url("../stylesheets/PIE.htc");
// I've tried 'stylesheets/PIE.htc' and '/pink/stylesheets/PIE.htc' (all webpage is in folder 'pink').
$pie-base-class: pie-base;

.pie-base {
  @include pie-element(relative);
}

body {
  @include pie;
  @include background(
      image-url('header_background.png') no-repeat top center,
      linear-gradient(top center,
        $bg-gradient-start, $bg-gradient-stop
      ) no-repeat,
      image-url('wavy-white.jpg')
    );
}

What's wrong with it?


Solution

  • I've found that cssPIE don't understand rgba values so my idea of making gradient from colour to transparent shouldn't work :/ Also IE don't understand inline SVG in CSS styles so even that feature isn't working. So only way is to make another style for IE and delete gradients from all gradiented elements :/