CSS3 Pie doesn't work at all, tried everything

Question

I am trying to apply css3pie

to my site, and it doesn't seem to apply at all. I tried everything I could find:

• I checked the path to PIE.htc, put it in the main folder and used url (/PIE.htc), even tried the full URL, nothing worked.
• Tried to use PIE.php, this did not work either.
• Tried to add "AddType text / x-component.htc" to the .htaccess file, not very good
• I tried to add position:relative; z-index: 0; position:relative; z-index: 0; , nothing good.

The code I'm trying to apply is as follows:

  -webkit-box-shadow: 0px 0px 13px rgba(0,0,0,.9); -moz-box-shadow: 0px 0px 13px rgba(0,0,0,.9); box-shadow: 0px 0px 13px rgba(0,0,0,.9); 

What am I missing?

EDIT: if that matters when I look at the loaded css in IE, I see that the behavior command is on the same line as the following, although the syntax is correct.

Answer 1

Use the web developer tools (F12) to find out if there are any <css3-container> elements that are created. If not, then there is a problem with your behaviour css declaration. If these elements exist, do not change anything with PIE.htc - this is a problem with the style, and you can get around things like position:relative; z-index: 0; position:relative; z-index: 0; .

Answer 2

Use the link to your site. For instance:

 behavior: url('http://www.yoursite.com/css/PIE.php') 

It will work fine.

Answer 3

CSS3PIE puts its generated elements as the sibling of the element you are creating, with an index of z-index -1. You may not see the result, because it is located behind another element of the document. Try wrapping the items you create in a container with an independent z-index. Hope this helps!

Answer 4

It all depends on your server settings:

Assuming DIR "pie" refers to your "root" DIR, try one of the following:

  behavior: url(/pie/PIE.php); behavior: url(pie/PIE.php); 

Also try:

  position:relative; z-index: 0; 

Do not use IE IE hacks with PIE, for example:

  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0074a8',endColorstr='#006496',GradientType=0); background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJod…EiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); 

Answer 5

CSSPie3 does not support window shadow when you try to use blur. It is simply not possible.

Instead, remove the blur and your shadow frame will work.

See sources here:

http://css3pie.com/forum/viewtopic.php?f=3&t=991

http://css3pie.com/documentation/supported-css3-features/

Unfortunately, PIE only supports rgba opacity in the shadow of the window if it has no blur.

http://css3pie.com/documentation/suppor ... ures / # rgba

Often you can get around this by simply using a lighter shade of your opaque color. If you want other browsers to use rgba, you can use -pie-box-shadow to override it only for PIE.

Answer 6

Try using the hexadecimal notation for the color instead. The documentation says that there are restrictions on using the rgba entry:

 box-shadow: 0px 0px 13px #000; filter: Alpha(Opacity=90); opacity: 0.9; behavior: url(/Pie.htc); 

Answer 7

I had the same problem. PIE does not work at all, be it htc, js or php. The problem was allowing access to the Mac server to the PIE folder that I downloaded and unpacked. It was not available to all users. Access to readonly has been changed and now it works! Beginners mistake. :)