Cross-browser CSS3 box-shadow

There is a simple way for creating cross-browser box-shadow in all modern and popular browsers including Internet Explorer (Opera only since 10.50 pre-alpha version).

box-shadow for modern browsers (except IE8)

You can use following code for Firefox, Safari, Chrome and Opera 10.50 pre-alpha:

.box-shadow {
-moz-box-shadow: 10px 10px 10px #000; /* Firefox */-webkit-box-shadow: 10px 10px 10px #000; /* Safari, Chrome */box-shadow: 10px 10px 10px #000; /* CSS3 */}

If you are using an up to date version of Firefox, Safari or Chrome, it’s enough to use just this CSS:

.box-shadow {
box-shadow: 10px 10px 10px #000; /* CSS3 */}

box-shadow for Internet Explorer

Download the ie-css3.htc file, put it in the same place where your CSS file, and then use this CSS code for Internet Explorer to make

box-shadow

:

.box-shadow {
behavior: url(ie-css3.htc);
}

It’s reasonable to connect this CSS through conditional comments.