I have a box shadow written (#content .shadow) that works well in most all browsers except for IE. I found an article showing the -ms-filter and -filter add ons but I cannot figure out how to translate or convert the different properties. With the -filter properties, I don't see that many options for blur, h-shadow, v-shadow, and spread. Does "strength" translate to "spread" and so on...?
-webkit-box-shadow: 0 -11px 22px -8px #777;
-moz-box-shadow: 0 -11px 22px -8px #777;
box-shadow: 0 -11px 22px -8px #777;
/* For IE 8 */ -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=8, Direction=0, Color='#777777')";
/* For IE 5.5 - 7 */ filter: progid:DXImageTransform.Microsoft.Shadow(Strength=8, Direction=0, Color='#777777');
Thanks in advance to anyone who can help me out here.
Did you look here? http://msdn.microsoft.com/en-us/library/ie/ms532985(v=vs.85).aspx
Out of curiousity - Does your site have the marketshare to require you to support below IE8? Is it worth your effort for a drop shadow?
Dave, I did not look there but I will take a peek. Not sure about the marketshare requirement, but the client is using that specific browser; so that makes it important.
ugh. understandable why you're supporting it but still - ugh.
Here's another link you might find useful: http://hedgerwow.appspot.com/demo/shadow
I use this: http://css3pie.com/
The filter property tends to be a pain to work with.
I hardly write the code my own, usually I relied on CSS generators.
Box shadow tool:
http://www.css3.me/ (IE7 and IE8 unsupported CSS3 element)
If above tool not working, you may try the alternative generators
This topic is now closed. New replies are no longer allowed.