Skip navigation
Currently Being Moderated

Box shadow problem in IE 8-9

Feb 10, 2013 5:57 PM

Tags: #ie8_issues #box_shadows #ie9_issues

I want to place CSS drop shadows on different objects on a web page. It works perfectly in Safari, FF, Chrome and Opera both in Widows and OS X, but fails in IE 8 & 9. Any help would be much apreaciated. VL Branko

 

Here is the CSS:

 

/* this is for putting drop shadows on images that are placed in the text area which is generally white or very light colored */

 

.dropshadowtext {

-moz-box-shadow: 5px 5px 8px #999; /* Firefox */

-webkit-box-shadow: 5px 5px 8px #999; /* Safari/Chrome */

box-shadow: 5px 5px 8px #999; /* Opera and other CSS3 supporting browsers */

-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color=#999999)";/* IE 8 */

: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color=#999);/* IE 5.5 - 7 */

}

 

/* this is for putting drop shadows on images that are placed in areas other than the text area  */

 

.dropshadowbackground {

-moz-box-shadow: 6px 6px 5px #35454c; /* Firefox */

-webkit-box-shadow: 6px 6px 5px #35454c; /* Safari/Chrome */

box-shadow: 6px 6px 5px #35454c; /* Opera and other CSS3 supporting browsers */

-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color=#35454c)";/* IE 8 */

: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color=#35454c);/* IE 5.5 - 7 */

}

 

/* this is for putting a drop shadow under the area where there text is written color of shadow will depend on the background*/

.dropshadowunderwritingarea {

-moz-box-shadow: 6px 6px 5px #35454c; /* Firefox */

-webkit-box-shadow: 6px 6px 5px #35454c; /* Safari/Chrome */

box-shadow: 6px 6px 5px #35454c; /* Opera and other CSS3 supporting browsers */

-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color=#35454c)";/* IE 8 */

: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color=#35454c);/* IE 5.5 - 7 */

}

 
Replies

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points