Comments on: CSS3 Drop Shadow

By: Matt

Matt — Mon, 03 Oct 2011 05:44:06 +0000

Thank you.

By: Aejay

Aejay — Tue, 16 Aug 2011 20:49:19 +0000

@ Kevin:

Are you talking about the CSS3 styles in the post itself? If so, you could start by reading the whole damn post, instead of skipping details and then asking for those same details in the comments.

“The first two attributes of each of the properties are the horizontal and vertical offsets for the shadow, the third is the blur radius, and the final one sets the color of the drop shadow.”

So, your first two values would be 0 and 0, and the third value would depend on how blurred you want the image.

If you’re talking about IE, just do it in CSS3 for now. IE<8 won't support it, but it's better than having to make special code to support old, crappy, legacy browsers. The more work you do to support those browsers, the more hits on the performance of those who use good browsers, and that's not fair.

By: Kevin

Kevin — Thu, 21 Jul 2011 14:08:53 +0000

ok n/m i got the first 1 to work but how do i get it work with no angle on it and a soft d.shadow around the whole photo instead of on the right side and bottom?

By: Kevin

Kevin — Thu, 21 Jul 2011 14:06:09 +0000

I tried all of the code you guys posted for a drop shadow on a photo and none of them work :(. What am I doing wrong?

By: Don

Don — Fri, 04 Feb 2011 18:51:20 +0000

Hey, thanks for this excellent tip, I was wondering if regular ol’ CSS could do stuff like this, but not without using images and blah blah blah. I’m going to look into CSS3 tutorials now, that you’ve introduced me to a very simple, powerful procedure.

By: Jeffrey

Jeffrey — Wed, 12 Jan 2011 23:02:29 +0000

ok I am MEGA green here but…I would love to be able to drop a shadow along the edges of my blog in BLOGGER..does this work for that? Where does the code go?

By: Tyron Rosenbalm

Tyron Rosenbalm — Sun, 31 Oct 2010 19:47:08 +0000

I’d have to concur with you here. Which is not something I typically do! I love reading a post that will make people think. Also, thanks for allowing me to comment!

By: AUGENREIZ Internet-Agentur

AUGENREIZ Internet-Agentur — Wed, 27 Oct 2010 22:45:30 +0000

SOFT SHADOWS FOR THE INTERNET EXPLORER

With IE8 still not capable of rendering proper soft shadows I did some tests with multiple IE-shadows. If you add eight (!) shadows to your image the result is not too bad. Even on pages with many images the rendering time doesn’t seem to be affected.

The equivalent of “box-shadow: 0px 3px 9px #dddddd” is:

filter:
progid:DXImageTransform.Microsoft.Shadow(color=#dddddd,direction=0,strength=1)
progid:DXImageTransform.Microsoft.Shadow(color=#dddddd,direction=45,strength=1)
progid:DXImageTransform.Microsoft.Shadow(color=#dddddd,direction=90,strength=4)
progid:DXImageTransform.Microsoft.Shadow(color=#dddddd,direction=135,strength=4)
progid:DXImageTransform.Microsoft.Shadow(color=#dddddd,direction=180,strength=7)
progid:DXImageTransform.Microsoft.Shadow(color=#dddddd,direction=225,strength=4)
progid:DXImageTransform.Microsoft.Shadow(color=#dddddd,direction=270,strength=4)
progid:DXImageTransform.Microsoft.Shadow(color=#dddddd,direction=315,strength=1)

Enjoy,
Tyron Montgomery

By: Richard Arran Landscape Photography

Richard Arran Landscape Photography — Wed, 27 Oct 2010 12:59:12 +0000

I so wish we had full browser support for CSS3. Life would be so much easier.

By: xray

xray — Sat, 16 Oct 2010 15:12:37 +0000

Only thing I could suggest is to have the background white. If someone have any other idea, I’m all ears:)