CSS3 box-shadow blur in IE9

Question

Has anyone else noticed that IE9\'s \"standard\" implementation of CSS box-shadow differs from other browsers? Whenever I use box-shadow and set a blur value, IE9 seems to r

Answer 1

Unfortunately MS does not seem to understand the concept of standards.

I think the simplest solution is to set up a conditional style sheet.

I've found I need to adjust up about 40% in IE9 to match Firefox, et al.

Firefox CSS:

-moz-box-shadow: 0px 0px 11px rgba(0, 0, 0, .7);
-webkit-box-shadow: 0px 0px 11px rgba(0, 0, 0, .7);
box-shadow: 0px 0px 11px rgba(0, 0, 0, .7); 

IE9 CSS:

-moz-box-shadow: 0px 0px 18px rgba(0, 0, 0, .7);
-webkit-box-shadow: 0px 0px 18px rgba(0, 0, 0, .7);
box-shadow: 0px 0px 18px rgba(0, 0, 0, .7);