Himas Rafeek
Posted on: 3 years ago
CSS

Show Box Shadow in CSS

This can be used in casting shadows off block-level elements like divs, tables etc. (still not supported in IE7 and IE8). Parameters (from left to right): horizontal offset of the shadow, vertical offset of the shadow, blur radius (optional), spread radius (optional), color.


                                          .shadow {
    -moz-box-shadow: 4px 5px 5px 1px #777;
    -webkit-box-shadow: 4px 5px 5px 1px #777;
    box-shadow: 4px 5px 5px 1px #777;
}
.shadowIE {
    background-color: #f5f5f5;
    /* need for IE*/    -moz-box-shadow: 4px 5px 5px 1px #777;
    -webkit-box-shadow: 4px 5px 5px 1px #777;
    box-shadow: 4px 5px 5px 1px #777;
    filter: progid:DXImageTransform.Microsoft.Blur    (PixelRadius=3, MakeShadow=true, ShadowOpacity=0.30);
    -ms-filter: "
    progid: DXImageTransform.Microsoft.Blur     (PixelRadius=3, MakeShadow=true, ShadowOpacity=0.30)"
    ;
    zoom: 1;
}
.shadowIE .content {
    position: relative;
    background-color: #f5f5f5;
}