box-shadow

Read More at MDN DocsView Spec

Safe to Use

box-shadow is considered safe to use.

It’s supported by 94% of global browsers.

Browsers

ChromeMar 8, 2011v10.0.0
26%100%
100% of Chrome users are running a supported version.
SafariJul 20, 2011v5.1.0
5%100%
100% of Safari users are running a supported version.
EdgeJul 28, 2015v12.0.0
5%100%
100% of Edge users are running a supported version.
FirefoxMar 22, 2011v4.0.0
3%100%
100% of Firefox users are running a supported version.

Version Breakdown

 
Agent
Support
Adoption
Chrome
Mar 8, 2011 v10.0.0
26%100%
100% of Chrome users are running a supported version.
Mar 8, 2011 – Latest
v10.0.0+
26%100%

Full Support

Shadows affect layout in this browser. For example, if you cast an outer shadow to a box with a width of 100%, then you'll see a scrollbar.

Dec 11, 2008 – Latest
v1.0.0+
26%100%

Implemented with the vendor prefix: -webkit-

Chrome Android
Jun 27, 2012 v18.0.0
36%100%
100% of Chrome Android users are running a supported version.
Jun 27, 2012 – Latest
v18.0.0+
36%100%

Full Support

Shadows affect layout in this browser. For example, if you cast an outer shadow to a box with a width of 100%, then you'll see a scrollbar.

Jun 27, 2012 – Latest
v18.0.0+
36%100%

Implemented with the vendor prefix: -webkit-

Edge
Jul 28, 2015 v12.0.0
5%100%
100% of Edge users are running a supported version.
Jul 28, 2015 – Latest
v12.0.0+
5%100%

Full Support

Firefox
Mar 22, 2011 v4.0.0
3%100%
100% of Firefox users are running a supported version.
Mar 22, 2011 – Latest
v4.0.0+
3%100%

Full Support

Shadows affect layout in this browser. For example, if you cast an outer shadow to a box with a width of 100%, then you'll see a scrollbar.

Sep 20, 2016 – Latest
v49.0.0+
3%100%

Implemented with the vendor prefix: -webkit-

Jun 30, 2009 – Jun 5, 2012
v3.5.0 – v13.0.0

Implemented with the vendor prefix: -moz-

Firefox for Android
Mar 29, 2011 v4.0.0
Firefox for Android supports this feature.
Mar 29, 2011 – Latest
v4.0.0+

Full Support

Shadows affect layout in this browser. For example, if you cast an outer shadow to a box with a width of 100%, then you'll see a scrollbar.

Sep 20, 2016 – Latest
v49.0.0+

Implemented with the vendor prefix: -webkit-

Mar 29, 2011 – Jun 26, 2012
v4.0.0 – v14.0.0

Implemented with the vendor prefix: -moz-

Internet Explorer
Mar 14, 2011 v9.0.0
0%94%
There are no users of Internet Explorer running a supported version.
Mar 14, 2011 – Latest
v9.0.0+
0%94%

Full Support

To use box-shadow in Internet Explorer 9 or later, you must set border-collapse to separate.

Since version 5.5, Internet Explorer supports Microsoft's DropShadow and Shadow Filter. You can use this proprietary extension to cast a drop shadow (though the syntax and the effect are different from CSS3)

 
Quest Browser
Unknown v5.0.0
Quest Browser supports this feature.
Unknown
v5.0.0+

Full Support

Shadows affect layout in this browser. For example, if you cast an outer shadow to a box with a width of 100%, then you'll see a scrollbar.

Unknown
v5.0.0+

Implemented with the vendor prefix: -webkit-

Opera
Mar 2, 2010 v10.5.0
1%100%
100% of Opera users are running a supported version.
Mar 2, 2010 – Latest
v10.5.0+
1%100%

Full Support

Shadows affect layout in this browser. For example, if you cast an outer shadow to a box with a width of 100%, then you'll see a scrollbar.

Opera Android
May 21, 2013 v14.0.0
Opera Android supports this feature.
May 21, 2013 – Latest
v14.0.0+

Full Support

Shadows affect layout in this browser. For example, if you cast an outer shadow to a box with a width of 100%, then you'll see a scrollbar.

May 21, 2013 – Latest
v14.0.0+

Implemented with the vendor prefix: -webkit-

Safari
Jul 20, 2011 v5.1.0
5%100%
100% of Safari users are running a supported version.
Jul 20, 2011 – Latest
v5.1.0+
5%100%

Full Support

Shadows affect layout in this browser. For example, if you cast an outer shadow to a box with a width of 100%, then you'll see a scrollbar.

Oct 26, 2007 – Latest
v3.0.0+
5%100%

Implemented with the vendor prefix: -webkit-

Safari on iOS
Oct 12, 2011 v5.0.0
17%100%
There are no users of Safari on iOS running a supported version.
Oct 12, 2011 – Latest
v5.0.0+
17%100%

Full Support

Shadows affect layout in this browser. For example, if you cast an outer shadow to a box with a width of 100%, then you'll see a scrollbar.

Jun 29, 2007 – Latest
v1.0.0+
17%100%

Implemented with the vendor prefix: -webkit-

Samsung Internet
Apr 27, 2013 v1.0.0
2%100%
100% of Samsung Internet users are running a supported version.
Apr 27, 2013 – Latest
v1.0.0+
2%100%

Full Support

Shadows affect layout in this browser. For example, if you cast an outer shadow to a box with a width of 100%, then you'll see a scrollbar.

Apr 27, 2013 – Latest
v1.0.0+
2%100%

Implemented with the vendor prefix: -webkit-

WebView Android
Sep 3, 2014 v37.0.0
WebView Android supports this feature.
Sep 3, 2014 – Latest
v37.0.0+

Full Support

Shadows affect layout in this browser. For example, if you cast an outer shadow to a box with a width of 100%, then you'll see a scrollbar.

Sep 3, 2014 – Latest
v37.0.0+

Implemented with the vendor prefix: -webkit-

See Also

Contribute