advanced code snippet search

Posted By

kawohi on 09/18/10


Tagged

css CSS3 shadows


Versions (?)

Who likes this?

6 people have marked this snippet as a favorite

jearley
hmvrulz
devilsansclue
jplr
baczoni
droopysignal


Cross Browser CSS Box Shadows w/ RGBA

 / Published in: CSS
 

box-shadow is a new CSS3 Property that adds a drop shadow behind block elements.\r\nWith RGBA You can set the transparency of the CSS box shadows.

Expand | Embed | Plain Text 
  1. .box-shadows {
  2.    box-shadows: 2px 2px 5px rgba(0, 0, 0, .7); /* Future Proof & IE9 */
  3.   -webkit-box-shadows: 2px 2px 5px rgba(0, 0, 0, .7); /* Webkit Browsers */
  4.   -moz-box-shadows: 2px 2px 5px rgba(0, 0, 0, .7); /* Firefox */
  5.   -o-box-shadows: 2px 2px 5px rgba(0, 0, 0, .7);  /* Opera */
  6.   /* The Ugly Code: For IE Browsers */    
  7.   -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000')"; /* IE8 */
  8.   filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000'); /* IE5 - 7 */
  9. }

Report this snippet  

You need to login to post a comment.