Actinic and CSS3 and PIE

[Steve G Griggs]

Have you uploaded the pie.htc file? This is an essential file which contains all the javascript required. If the .htc file is missing the CSS just won't work at all.

[meden]

It can behave oddly in IE9 but you can tell IE9 to behave like IE8 by adding

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" >

to the header.

A slight update to this aspect of PIE is that the latest incarnation (beta 3) switches off PIE automatically in IE9 - so if IE9 supports CSS3 properly there should be no need for the emulate workaround.

[Steve G Griggs]

Thanks Mick.
That's worth knowing about. It could convince me to start using PIE on some "live" sites.

[graphicz]

I know some time has passed but have you all got PIE.htc working now???

I can get it working on a test page http://www.graphicz.eu.com/gali/acatalog/piex.html
It also works fine on a text page referencing the actinic and style css sheets:
http://www.graphicz.eu.com/gali/acatalog/piea.html
But it won't work within actinc in IE http://www.graphicz.eu.com/gali/acatalog/
But is fine in the other browsers.
PIE.htc is present in the acatalog folder:
http://www.graphicz.eu.com/gali/acatalog/PIE.htc
css is:

#cthree {width:190px;
-khtml-border-radius:10px; 
	border: 2px solid #F55D37;
   -webkit-border-radius: 10px;
   -moz-border-radius: 10px;
   border-radius: 10px;
	behavior: url('PIE.htc');	
	padding:10px;
}

if I use the PIE.php option the borders dissappear completely in IE!!!

Thank you.

[graphicz]

Problem was solved by using:

behavior: url(PIE.php);

and adding position and z-index
(http://css3pie.com/)
Full css:

#cthree {width:190px;
-khtml-border-radius:10px; 
	border: 2px solid #F55D37;
   -webkit-border-radius: 10px;
   -moz-border-radius: 10px;
   border-radius: 10px;
	padding:10px;
	behavior: url(PIE.php);	
	position:relative;
	z-index:0;
}

Once it was working I added shadow:

#cthree {width:190px;
	background: #fff;
	-khtml-border-radius:10px; 
	border: 2px solid #F55D37;
   -webkit-border-radius: 10px;
   -moz-border-radius: 10px;
   border-radius: 10px;
   -webkit-box-shadow: #666 0px 4px 4px 0px;
	-moz-box-shadow: #666 0px 4px 4px 0px;
	box-shadow: #666 0px 4px 4px 0px;
	padding:10px;
	behavior: url(PIE.php);	
	position:relative;
	z-index:0;
}

If you are viewing this after the example links have gone please message me for example html files.

Thanks

[cheaptents]

is that not the standard way to call pie? I kind of assumed that had been done.