Blog

I am thrilled to announce the release of CSS3 PIE version 1.0.0!

This release marks a major milestone: the dropping of the “beta” label. Our five beta releases have given us twenty-two months of solid real-world testing as you, the web community, have used it on your sites. You’ve really put it through its paces, given us invaluable feedback and bug reports and helped us squash the bugs, and now we are confident in saying that PIE is solid and reliable enough to no longer be called a beta product.

Compared to beta5, the final version 1.0.0 contains only a few fixes for major issues:

• Fixed divide-by-zero error in box-shadow renderer
• Fixed error when element is removed after hovering
• Fixed error when printing in IE9
• Fixed rendering when using browser zoom in IE7 and 8

In addition, we have added support for two new custom CSS properties: -pie-track-hover and -pie-track-active — setting these to false will disable PIE’s default automatic tracking of :hover and :active styles, which can give a small performance boost and prevent issues with scrollbars in IE7 (see issue 190).

See the full changelog for details.

Download CSS3 PIE 1.0.0 now!

Moving Forward…

While focusing on stability for 1.0.0, we’ve been very busy with other things too! The master branch in GitHub, which will become the 2.0.x line, has already seen major architectural improvements, several new features, and lots of fixes. We’ll start releasing this cutting-edge code in 2.0 beta releases soon, in parallel with the rock-solid 1.0.x line, so stay tuned!

It’s that time again… another PIE release! Version 1.0 beta 5 is now ready for your coding pleasure.

What’s new and big in this release? IE9 support! This release fills in the few CSS3 features that PIE already supported in IE 6-8 that aren’t natively supported by IE 9′s own rendering engine, specifically: linear-gradient in backgrounds, and border-image.

These features were totally re-implemented for IE 9 using SVG behind the scenes, which allowed us to avoid some of the limitations of the VML used in earlier IEs. For example: you can freely use rgba colors with opacity in gradients, and you can use the ‘repeat’ and ’round’ schemes in border-image. You can also use gradients in conjunction with background-size/position/repeat to create complex background patterns — we’ve got a new demo of some gradient patterns you can check out in IE 9.

Please note: IE 9 is apparently much more strict than earlier versions about requiring PIE.htc to be served with the correct content-type header. As always, make sure your server is configured to send the correct content-type header for .htc files.

In addition to the new IE 9 support, many other issues have been resolved including:

• The border-image support in IE 6-8 has been improved: it now correctly hides the actual border, and prevents collapsing of the border-width if a border-style is not set
• An error caused by non-px units on elements that cannot have children has been fixed
• The background origin and clip parameters are correctly parsed within -pie-background styles
• Padding on img elements is now correctly rendered
• Style changes due to :focus and :active pseudo-classes are now correctly detected
• The ‘transparent’ keyword is now recognized as a color when parsing styles
• A small number of IE installations out there without a functioning VML engine will no longer see errors and will fall back to non-CSS3 styles
• Various error conditions are fixed

See the full commit log for more details about the changes.

A note about file size: due to the added IE 9 support, the PIE.htc file is now roughly 6kB larger than the beta4 release. It is planned for a future release to split out IE 9 support and IE 6-8 support into separate files so the download size will be smaller for each version. We recognize that keeping this thing light is very important.

A special thanks go to the users in the forums who helped test and reported bugs against development builds of the new IE 9 support. Getting your real-world testing made a big difference in its quality!

Ready to go? Download PIE 1.0 beta 5 and get to it!

The nominations for the .net Magazine Awards 2011 came out this morning. I was shocked when my wife came running in to tell me that PIE had been nominated!

PIE’s nomination is in the “Innovation of the Year” category, which puts it up against some impressive heavyweights such as Google+, jQuery Mobile, and (dear to my heart) Sencha Touch. I’m not sure how PIE got nominated, but to whoever made that happen: thank you! I feel greatly honored.

If you’d like to vote for PIE, hop on over!

It kind of snuck up on me, but I actually managed to remember that today is the one-year anniversary of CSS3 PIE’s first public beta release. It’s been quite an exciting year since I unleashed this little thing out into the world!

In pure nerd style, here are some stats from the past year:

• 2.3 million page views from 452,000 unique visitors at css3pie.com
• 2700 posts by 760 users in 690 topics in the user forums
• 155,000 downloads
• 1056 followers on GitHub
• 1979 followers on Twitter (closing in on 2000, who will it be?)
• 156 commits to the master code branch with many more in other branches

What can’t be put into numbers, of course, is the overwhelmingly positive reaction from users around the world. It’s really been an awesome experience hearing words of enthusiastic support from hundreds of web developers whose lives are a little bit easier with PIE in their toolbox.

Further development is continuing steadily with help from some ambitious community members; stay tuned for a beta5 release coming in the next couple of weeks. Year two is going to be great!

CSS3 PIE version 1.0 beta 4 has been released. This is primarily a bugfix release. Major fixes include:

• Fixed JavaScript error when printing
• Tweaked detection of IE9 to perform rendering in compatibility and quirks modes but disable rendering in IE9 standards mode
• Fixed errors in rendering of border-image, images with zero dimensions, and others (thanks to Keith Gable)
• Prevented multiple downloads of images used more than once in a page
• Added support for CSS3 color keywords (thanks to Don Retzlaff)
• Fixed border-width keywords like ‘medium’
• Corrected positioning in RTL text environments
• Added a new -pie-poll custom CSS property which allows specifying that PIE should periodically check certain elements for position and size changes. This is useful for situations where IE does not fire onmove and onresize events when it should.

See the full changelog, and download PIE 1.0 beta 4 now.

After this beta 4 release, the priority for development is introducing proper support for missing CSS3 features in IE9, notably linear-gradient and border-image.