Comments on: CSS performance: UI with fewer images

By: Archer

Archer — Fri, 13 Aug 2010 15:35:21 +0000

Great tutorial & example. Save my time to build web site so much.

Thanks for your work.

By: Scott Lepich

Scott Lepich — Mon, 05 Apr 2010 16:44:33 +0000

Thanks for this wrap up Stoyan. It inspired me to revisit the MS filters and reminded me of the “light” filter that solved a CSS problem I had.

Also, if you combine the “glow” filter with a clipping wrapper element then you can achieve a drop shadow in IE6 css.

Sample:
http://cl.ly/HqH

Thanks for the inspiration!

By: Thien Rong

Thien Rong — Wed, 06 Jan 2010 03:57:23 +0000

Nice!

Just a small thing, perhaps the buttons should have the css for the hand cursor.

By: Mike

Mike — Tue, 05 Jan 2010 17:15:58 +0000

Maybe it is just me, but the drop shadows don’t work on a div in IE (but will applied to a table).
Am I doing something wrong?

By: Faisal Khan

Faisal Khan — Sat, 02 Jan 2010 19:16:02 +0000

Cool bag of tricks there. I knew a few but stuff like gradients and transparency was new to me.

Good job overall.

By: symphoorke

symphoorke — Mon, 28 Dec 2009 20:45:30 +0000

don’t forget sprites to limit the number of hits to the server if ever you need lots of pictos

By: BKH

BKH — Sun, 27 Dec 2009 17:55:38 +0000

Wow! Superb article!
Thank you for the great work.

By: Jazio

Jazio — Sat, 26 Dec 2009 00:44:20 +0000

I found very useful this tutorial. I wonder when will Microsoft will simplify the syntax? What does all progID bla bla syntax is useful for..?

By: Anewczs

Anewczs — Thu, 24 Dec 2009 20:32:28 +0000

Great!

By: Paul Irish

Paul Irish — Thu, 24 Dec 2009 01:51:58 +0000

Continuing last comment.. Here’s the cached demo page: http://bit.ly/8S2fAK

and the CSS looks something like:

/* supported: ff3.5+,Saf3+, Chrome, IE6+ */
/* not supported: opera (also 10.5) */
.shadow {
box-shadow: 3px 3px 14px rgba(100,100,100,.7);
-moz-box-shadow: 3px 3px 14px rgba(100,100,100,.7);
-webkit-box-shadow: 3px 3px 14px rgba(100,100,100,.7);
background: #000\9; /* hack to isolate IE */
filter:progid:DXImageTransform.Microsoft.Blur(pixelradius=14,makeshadow=’true’, shadowopacity=0.7);
-ms-filter:progid:DXImageTransform.Microsoft.Blur(pixelradius=14,makeshadow=’true’, shadowopacity=0.7);
}