Topic: CSS3PIE enabled facelift for Westmount Park Church website
two weeks ago I discovered the css3pie project which allows web sites to use newer CSS3 attributes such as curves, drop shadows and linear gradients while at the same time letting those visitors using IE6, 7 and 8 (which don't do that out of the box) see the same effects in their browsers. It works by using an .htc script file (only works in IE) to parse your CSS, and then generating equivalent effects on the fly by using VML. Genius!
The end result is that we can now do all those fancy layouts WITHOUT resorting to graphics for the curves, shadows and backgrounds or clumsy tag nesting that pollutes the HTML with clumsy non-semantic markup. It also makes changes like 'can you just change the page background to green' a lot less hastle - no longer do you have to dip into a paint package and recreate all those graphical bits each time a customer says 'let me see that in a red', you just change a hex value in your CSS and you're done.
I also discovered that you don't need to have the behavior attribute in each rule to use this in IE - all you really need is a single class with that behavior in - I called mine css3 for obvious reasons - you then apply that class name to any tag you want to have these efects on. It's pretty clean code.
I just did a facelift for one of my Ecclesiact church customers, and you can see it at http://westmountparkchurch.org.
Because it's Ecclesiact you still get all the AJAX-driven drag and drop ordering of site menus, and context-menu editing of postings and content blocks, but for end users the HTML is pretty clean.
This site also features a new breadcrumb style for all browsers other than IE6-7 which you can see a good example of here.
Incidentally, if anyone wants to help me make that breadcrumb styling work properly in IE7, I did post a request for help on that here a while ago, but no takers as yet.
So, what do you all think?
Last edited by classaxe (2011-06-12 13:32:03)